淘汰賽，如何訂閱observableArray的每一個變化

Question

你能幫我拿到訂閱on every change of my observable collection and on every item change。沒有找到http://knockoutjs.com/documentation/observableArrays.html

$(document).ready(function() { 

    var Item = function (isSelected, isEnabled, errorState, 
    name, group, processed, errors, state) { 
     var self = this; 
     self._isSelected = ko.observable(isSelected); 
     self._isEnabled = ko.observable(isEnabled); 
     self._errorState = ko.observable(errorState); 
     self._name = ko.observable(name); 
     self._group = ko.observable(group); 
     self._processed = ko.observable(processed); 
     self._errors = ko.observable(errors); 
     self._state = ko.observable(state); 
    }; 

    function ViewModel() { 
     var self = this; 
     self.SentinelList= ko.observableArray([ 
     ko.observable(new Item(false, false, false, 'Mail1', 'Mailing', 4, 0, 1)), 
     ko.observable(new Item(false, false, false, 'Ident1', 'Identity', 5, 0, 0)), 
     ko.observable(new Item(false, false, false, 'Cook', 'Look', 2, 0, 1))]); 
    } 

    var vm = new ViewModel(); 

    for (var item in vm.SentinelList) { 
     item.subscribe(function() { 
      console.log('List changed'); 
     }); 
    } 

    ko.applyBindings(vm); 
}); 

Answer 1

信息您可以使用訂閱數組againt：

self.SentinelList.subscribe(function (changes) { 

     changes.forEach(function (change) { 
      if (change.status === 'added') { 
       console.log('new item !!'); 
       change.value.subcriptions.push(change.value.subscribe(event)); 
      } else if (change.status === 'deleted') { 
       ko.utils.arrayForEach(change.value.subcriptions, function(s) { 
        if(s) s.dispose(); 
       } 
            ); 
       console.log('deleted item !!'); 
      } 
     }); 

    }, null, "arrayChange"); 

See fiddle

Answer 2

您可以使用跟蹤視圖模型的變化的外部插件。例如KO-反應堆在這種情況下訂閱

https://github.com/ZiadJ/knockoutjs-reactor

看起來像

for(var i = 0; i < vm.SentinelList().length; i++){ 
    ko.watch(vm.SentinelList()[i], { recurse: true }, function(params, modifiedProperty) { 
     console.log('SentinelList changed'); 
    }); 
} 

JSFIDDLE