2013-10-07 79 views
0

我有一個可映射到複選框列表的項目的observableArray。他們開始的時候都被忽略了。但是,當選擇特定的項目時,我想要選中一組複選框。如何在observableArray中設置複選框的值

我的視圖模型:

 function ModelView(data) { 
      var self = this; 

      self.Items= ko.observableArray(data.Items); 
      self.ItemOptions = ko.observableArray(data.ItemOptions); 

      self.PreSelectOptions = function(item){ 
       ko.utils.arrayForEach(self.ItemOptions(), function (itemoption) { 
       var selected = false; 
       //Loop through the options the item has and preselect the checkboxes 
       for (var i = 0; i < item.Option.length; i++) { 
        if (itemoption.ID == item.Option[x]) { 
         selected = true; 
         break; 
        } 
       } 

       itemoption.chosen = selected;//Check the checkbox 
      }); 


     } 

HTML片段:

 <ul data-bind="foreach: channels"> 
      <li> 
       <input type="checkbox" data-bind='checked: chosen' /><span data-bind="text: ChannelName"></span></li> 
     </ul> 

我已經通過代碼加強和itemoption.chosen被設置爲true。我必須重新綁定複選框嗎?

回答

1

問題是chosen不是可觀察的。當綁定到不可觀察對象時,綁定不會自動更新。

你可以使它可觀察到的,像這樣運行代碼設置self.ItemOptions後:

ko.utils.arrayForEach(self.ItemOptions(), function (itemoption) { 
    itemoption.chosen = ko.observable(itemoption.chosen); 
}); 

然而,由於self.ItemOptions是data.ItemOptions的shallow copy,數據對象的項目的選項也將被修改爲使用observable。一個更好的選擇可能是使用了ko.mapping插件:

self.ItemOptions = ko.mapping.fromJS(data.ItemOptions); 

在這兩種情況下,你需要改變你的語法來引用chosen作爲可觀察到的:

itemoption.chosen(selected); // Check the checkbox 
+0

輸入類型不具有值這麼淘汰賽不會真的知道要檢查什麼可能必須增加值:ChannelName到輸入 – dbarnes

+0

上的數據綁定,這回答了我原來的問題。但第二個問題出現了: – DanScan

+0

@DanScan你錯過了一些文字?這句話似乎沒有完成。無論如何,如果問題是分開的,你可能想要開一個新的問題。 – Cyanfish