Knockout Filter針對另一個observableArray的observableArray

Question

比方說，我有一個名爲completeArray的observableArray和另一個名爲pickedArray的observableArray，第二個數組（pickup）包含completeArray的一些對象。從這兩個數組中，我需要製作另一個observableArray，它將包含completeArray中所有不在拾取數組中的對象。如果任何人都可以幫助我如何做，請評論你是否需要澄清一些事情。謝謝！

Answer 1

使用computed observable陣列的completeArray和pickedArray之間的差異。

的Javascript

var ViewModel = function() { 
    var self = this; 

    self.completeArray = ko.observableArray([{id: 1, name: "john"}, {id: 2, name: "bill"}, {id: 3, name: "tom"}]); 
    self.pickedArray = ko.observableArray([{id: 1, name: "john"}, {id: 3, name: "tom"}]); 

    self.diffArray = ko.computed(function() { 
     return ko.utils.arrayFilter(self.completeArray(), function(completeItem) { 
      var sameItem = false; 

      ko.utils.arrayForEach(self.pickedArray(), function(pickedItem) { 
       if(pickedItem.id == completeItem.id && pickedItem.name == completeItem.name) { 
        sameItem = true; 
        return; // break out of this loop 
       } 
      }); 

      return !sameItem; 
     }); 
    }, self); 
}; 

$(function() { 
    var vm = new ViewModel(); 
    ko.applyBindings(vm); 
}); 

HTML

<h1>Complete Array</h1> 
<div data-bind="foreach: completeArray()"> 
    <span data-bind="text: $data.name"></span> 
</div> 

<h1>Picked Array</h1> 
<div data-bind="foreach: pickedArray()"> 
    <span data-bind="text: $data.name"></span> 
</div> 

<h1>Diff Array</h1> 
<div data-bind="foreach: diffArray()"> 
    <span data-bind="text: $data.name"></span> 
</div> 

輸出

一系列完整
約翰·湯姆法案

採摘陣列
約翰·湯姆

DIFF陣列
法案

例

http://jsfiddle.net/jdtjmy6u/3/