javascript - KnockoutJS, batch update observableArray? -

javascript - KnockoutJS, batch update observableArray? -

i have next scenario:

a list of items represented observablearray, besides content/title etc. create each of them collapsible in view.

now problem becomes if should store state each item's observable: if how implement trigger toggle items open/close efficiently - ie. minimize dom update.

ko.utils.arrayforeach seems way go, trigger view refresh @ end of loop? there improve way?

ko.utils.arrayforeach(this.items(), function(item) { ... item.close(true); ... });

edit: what's happening in dom (inside knockout foreach loop)

<div class="item"> <!-- ko 'if': !close() --> <div class="article" data-bind="html: article"></div> <!-- /ko --> </div>

so can click button somewhere on page, run ko.utils.arrayforeach toggle items. works, don't know if it's best way (eg. trigger dom update 1 time instead of each item).

to mind need implement filtering. create new filtered array based on array , show items depend on property.

vm.filtereditems = ko.computed(function () { homecoming ko.utils.arrayfilter(this.items(), function (fitem) { if ('open' == fitem.state()) { homecoming true; } homecoming false; }); }, vm);

change state property in appropriate event each item , bind filtereditems list control.

check out next example more details

javascript dom mvvm knockout.js