Шаблон JSViews не обновляется при изменении базовых данных

У меня проблема с обновлением шаблона JSViews при изменении базовых данных. Он включает в себя промежуток, который связан с данными с использованием функции конвертера к базовым данным. Когда базовые данные изменяются после асинхронного обратного вызова на сервер, текст диапазона не обновляется.

Разметка:

{^{for thedata.myarrayobject}}
    <span data-link="{myconverter:var1:} name{:'theName' + var2}"></span>
{{/for}}

Автор сценария:

$.views.converters({
    myconverter: function (val) {
        switch (val) {
            case 1: 
                return 'Test1'; 
                break;
            case 2: 
                return 'Test2';
                break;
            default: 
                return 'Default';
        }
    }
});

Диапазон корректно отображается при загрузке страницы в соответствии со значениями в data.myarrayobject. Например, если у нас есть:

thedata.myarrayobject[0].var1='1';
thedata.myarrayobject[0].var2='John';
thedata.myarrayobject[1].var1='2';
thedata.myarrayobject[1].var2='Matthew';

он будет загружен как:

<span name="theNameJohn">Test1</span>
<span name="theNameMatthew">Test2</span>

Однако, если базовые данные изменяются после асинхронного обратного вызова:

thedata.myarrayobject[0].var1='2';
thedata.myarrayobject[0].var2='John';
thedata.myarrayobject[1].var1='1';
thedata.myarrayobject[1].var2='Matthew';

текст промежутка остается неизменным.

Я отладил код js, и базовый параметр массива 'var1' определенно устанавливается в новое значение. Я пытался позвонить:

$.observable(thedata.myarrayobject).refresh(thedata.myarrayobject);

но безрезультатно.

Я, очевидно, хочу, чтобы текст диапазона корректировался при изменении базовых данных - любая помощь будет принята с благодарностью!

2 ответа

Решение

Фактически, чтобы сделать обновление, вам нужно выбрать собственную стратегию объединения новых данных (например, из вызова Ajax) с предыдущими данными.

Но любое объединение должно быть выполнено с использованием "наблюдаемых" API - так, чтобы JsViews получал уведомления об обновлении связывания данных и обновлял ваш пользовательский интерфейс.

Таким образом, в зависимости от ваших данных и сценария, вы можете использовать любой из следующих видов обновлений:

  1. Измените значения листьев по одному:

    $.observable(thedata.myarrayobject[0]).setProperty("var1", "2");

  2. Измените значения листьев по одному объекту за раз:

    $.observable(thedata.myarrayobject[0]).setProperty(newarrayobject[0]);

    (Это подберет любые измененные свойства)

  3. Обновите весь массив новыми объектами:

    $.observable(thedata.myarrayobject).refresh(newarrayobject);

    (Это скопирует новые объекты / предметы в myarrayobject)

  4. Обновите объект myarrayobject новым:

    $.observable(thedata).setProperty("myarrayobject", newarrayobject);

    Итак, здесь вы заменяете массив новым...

Любое или каждое из вышеперечисленных будет запускать обновления с новыми значениями данных.

Обратите внимание, что приведенные выше методы предполагают, что вы загрузили новый массив данных, newarrayobject который содержит обновленные данные для объединения с вашим предыдущим myarrayobject, Вам не нужно клонировать либо newarrayobject или предыдущий myarrayobject,

Ну а после того, как BorisMoore выше задал пару вопросов... То, как я обновлял данные - просто вставлял их прямо в параметры массива, как указано выше:

thedata.myarrayobject[0].var1='2';
thedata.myarrayobject[0].var2='John';
thedata.myarrayobject[1].var1='1';
thedata.myarrayobject[1].var2='Matthew';

не работал, и мой вызов $.observable(...).refresh(...) не работал, потому что я передавал тот же массив: не было никаких изменений, чтобы обновить разметку.

Просто я скопировал массив в новый, обновил значения, затем вызвал refresh, который работает:

var myduparrayobject = thedata.myarrayobject.splice();

myduparrayobject [0].var1='2';
myduparrayobject [0].var2='John';
myduparrayobject [1].var1='1';
myduparrayobject [1].var2='Matthew';

$.observable(thedata.myarrayobject).refresh(myduparrayobject);

Проблемы:

  1. Только заметные изменения в массиве будут обновлены в разметке. Не просто обновление данных объекта, как я думал.

  2. $.observable(...).refresh(...) работает только при передаче измененного массива в объект, на который есть ссылка. Передача того же объекта, на который есть ссылка, как я, (даже если он отличается от того, что отображается в разметке).) не будет вызывать изменения в разметке шаблона.

Другие вопросы по тегам