Knockout.js Шаблоны Foreach - принудительно завершить повторную визуализацию - PullRequest
Новая
       19

Knockout.js Шаблоны Foreach - принудительно завершить повторную визуализацию

6 голосов
/ 22 сентября 2011

По умолчанию KO "будет отображать шаблон только для нового элемента и вставит его в существующий DOM".

Есть ли способ отключить эту функцию (например, заставить KO заново визуализировать все элементы)?

Ответы [ 2 ]

7 голосов
/ 19 января 2013

Сегодня я столкнулся с подобной проблемой и смог решить ее для проблемы моей команды, заменив шаблон пользовательской привязкой, которая сначала очищает все данные ко и очищает контейнер перед рендерингом.

http://jsfiddle.net/igmcdowell/b7XQL/6/

Я использовал шаблон без контейнера, например: 

  <ul data-bind="alwaysRerenderForEach: { name: 'itemTmpl', foreach: items }"></ul>

и пользовательская привязка всегдаRerenderForEach: 

ko.bindingHandlers.alwaysRerenderForEach = {
  init: function(element, valueAccessor) {
    return ko.bindingHandlers.template.init(element, valueAccessor);
  },
  update: function(element, valueAccessor, allBindings, viewModel, context) {
    valueAccessor().foreach(); // touch the observable to register dependency
    ko.utils.domData.clear(element); // This will cause knockout to "forget" that it knew anything about the items involved in the binding.
    ko.utils.emptyDomNode(element); //Because knockout has no memory of this element, it won't know to clear out the old stuff.
    return ko.renderTemplateForEach(valueAccessor().name, valueAccessor().foreach, {}, element, context);
  }
};

Очевидно, что он немного запоздал как ответ на ваш запрос, но может помочь другим, кто включил это в поиск (как я).

7 голосов
/ 22 сентября 2011

Если вы используете собственный синтаксис jQuery.tmpl {{each koObservableArray()}}, Knockout не может обновить отдельные элементы, но должен перерисовать весь шаблон

подробнее здесь: http://knockoutjs.com/documentation/template-binding.html

встроенная поддержка каждого из движков шаблонов: после любого изменения шаблонизатор вынужден перерисовывать все, потому что это не знать о механизме отслеживания зависимостей KO.

Вы получаете «по умолчанию» поведение, только если вы используете режим шаблона foreach, т. Е .:

<div data-bind='template: { name: "personTemplate", 
                            foreach: someObservableArrayOfPeople }'> </div>
...