使用KnockoutJs 2.2綁定到基於knockoutjs的整數中的選擇元素作爲編輯者

我正在使用KnockoutJs 2.2。我有一個可以有零對多類別關聯的記錄。但是，我發現KnockoutJs實際上並沒有將該值綁定到記錄類別數組中的項目。使用KnockoutJs 2.2綁定到基於knockoutjs的整數中的選擇元素作爲編輯者

類別數組是{id，name}對象。這源於查找列表。

self.categories = ko.observableArray([{id:1,name:'Test1'},{id:2,name:'Test2'}]);

在我的視圖模型，我有一個記錄對象。此對象上的一個字段是類別（observableArray）。

categories: ko.observableArray([])

爲了簡化綁定，記錄對象在viewmodel上被稱爲「r」。

<div class="yui3-u-4-5"> 
    <!-- ko foreach: r.categories--> 
    <select data-bind="options: $parent.categories, optionsCaption:'-', 
optionsValue:'id', optionsText:'name', value:$data" /> 
    <div class="del" data-bind="click: $parent.removeCat" /> 
    <br /> 
    <!-- /ko --> 
    <button data-bind="click: addCat">Add category</button> 
</div>

當用戶添加或刪除一個類別，下面的代碼被稱爲：

self.removeCat = function (data) { 
    self.r.categories.remove(data); 
}; 

self.addCat = function() { 
    self.r.categories.push(ko.observable(null)); 
}

基本上，會發生什麼情況是，當一個類被添加到self.r.categories陣列，並且那麼您從下拉菜單中選擇一個類別，所選項目的值不會綁定到數組中的可觀察元素（$ data）。數組值保留爲空。

我已經重新創建這裏的問題：http://jsfiddle.net/fxXsq/

也許我應該做的這另一種方式？

感謝您的幫助克里斯

來源

2012-12-19 krisdyson

你不應該將實際的新的空觀測到您觀察到的陣列這樣。

self.addCat = function() { 
    self.r.categories.push(ko.observable(null)); 
}

此外，如果你希望你的對象的ID和Name屬性可觀察到，你需要爲他們

self.addCat = function() { 
    self.r.categories.push(new Category(null, self)); 
}; 

function Category(data, parent) { 
    var self = this; 
    self.Id = ko.observable(-1); 
    self.Name = ko.observable(''); 

    self.load = function(data) { 
     if (data) { 
      self.Id(data.Id); 
      self.Name(data.Name); 
     } 
    } 
    self.load(data); 
}

模型這是我我申請到我的所有型號通用模板更好地支持延期綁定和靈活性。

現在您將擁有一個observableArray r，其中包含Category具有可觀察屬性的對象。

來源

2012-12-19 17:07:06

使用KnockoutJs 2.2綁定到基於knockoutjs的整數中的選擇元素作爲編輯者

回答

相關問題