Knockout.Js selected從第二個集合中篩選的選項

Question

我將一個集合綁定到一個select multi，集合中的某些項目也在第二個集合中，我想將它們設置爲select multi中的selectedOptions。

我一直希望使用ko.utils.arrayFilter來做到這一點，但似乎不能過濾其他集合。

http://jsfiddle.net/dumbarse/BcUBK/

<select data-bind="options:availableThings,optionsText: 'Title', selectedOptions: selectedComputeThings" size="5" multiple="true"></select> 
     var initialThingsModel = [ 
      {"Id":1,"Title":"First"}, 
      {"Id":2,"Title":"Next"}, 
      {"Id":3,"Title":"Another"}, 
      {"Id":4,"Title":"Last"} 
     ]; 
      var initialSelectedThingsModel = [ 
      {"Id":2,"Title":"Next"}, 
      {"Id":4,"Title":"Last"}]; 

    var viewModel = { 
     availableThings: ko.observableArray(initialThingsModel), 
     selectedThings: ko.observableArray(initialSelectedThingsModel) 
    }; 
    viewModel.selectedComputeThings = ko.computed(function() { return ko.utils.arrayFilter(viewModel.availableThings(), function(item) { return item.Id == selectedThings.Id;}) }); 

     ko.applyBindings(viewModel); 

Answer 1

你應該修改computed，寫這樣的事：

viewModel.selectedComputeThings = ko.computed(function() { 
    return ko.utils.arrayFilter(
     initialThingsModel, 
     function(thing){ 
      return ko.utils.arrayFirst(
       initialSelectedThingsModel, 
       function(sel){ return sel.Id == thing.Id; } 
      ); 
     } 
    ); 
}); 

作品：http://jsfiddle.net/BcUBK/1/

更新：

跟蹤選擇你不需要computed - 只是簡單observableArray（哦，你alraedy有selectedThings在你的模型！）。只需填寫與參考選定的東西。

稍微修改您的selectedThings聲明：

selectedThings: ko.observableArray([]) 

轉換computed簡單的功能指派裁判對selectedThings觀察到的數組：隨時隨地前

viewModel.preselectThings = function() { 
    viewModel.selectedThings(ko.utils.arrayFilter(
     initialThingsModel, 
     function(thing){ 
      return ko.utils.arrayFirst(
       initialSelectedThingsModel, 
       function(sel){ return sel.Id == thing.Id; } 
      ); 
     } 
    )); 
}; 

添加函數調用/ ko.applyBindings後：

ko.applyBindings(viewModel); 

viewModel.preselectThings(); 

並在您的標記處處將selectedComputeThings更改爲selectedThings。

利潤！

http://jsfiddle.net/BcUBK/3/