添加/刪除Knockout observableArray嵌套元素

Question

我正在嘗試在KnockoutJS中的嵌套observableArray中添加/刪除。 我有幾個元素的數組，每個元素都有一個屬性對象，類型對象和一個保存對象的attributeValue數組。 因此，這是一個嵌套數組。

allAttributes數組是observableArray。 然后，我嘗試通過創建一個新的ViewModel（attributeValueViewModel）來使attributeValue數組可觀察，其中的attributeValues為ko.observableArray（[]）。

我做了兩個Knockout函數（這些函數不起作用），並且試圖在該數組中添加/刪除值。 問題是數組是嵌套的，因此我必須通過this.attribute.id訪問attributeID。 self.allAttributes [i] .attributeValues [j]應該是我要添加/刪除的對象...其中， i =屬性 ID ，j =屬性值對象的索引

這些功能為什么不起作用？

這是我的小提琴： http : //jsfiddle.net/M6Hqj/2/

Answer 1

首先，您要覆蓋內部視圖模型中的observable函數，例如，當您分配obj.attribute = item.attribute; ，您將覆蓋self.attribute = ko.observable(data.attribute);初始分配 。 而是通過可觀察對象分配值，如下所示：

obj.attribute(item.attribute); //instead of obj.attribute = item.attribute;

由於現在可以觀察到數組，因此這也將使您的self.addAttributeValue()函數調用起作用。

接下來，在你的self.removeAttributeValue()函數時， this電話實際上指的是特定的記錄您的內部 attributeValues陣列，因此，當你做this.attributeValues.splice()它不能找到你attributeValues對象屬性。 因此，將函數移到attributeValueViewModel對象中，並使用self代替this ，如下所示：

//This is inside function attributeValueViewModel(data)
self.removeAttributeValue = function() {
    alert(JSON.stringify(this));
    self.attributeValues.splice(this.id, 1);
}

要調用它，只需將數據綁定代碼更改為使用$parent而不是$root ，如下所示：

<button data-bind="click: $parent.removeAttributeValue">REMOVE</button>

像這樣的小提琴在這里： http : //jsfiddle.net/UMB79/

（請注意，通過這些更改，您仍然必須修改邏輯以正確添加/刪除元素，因為它仍然存在問題）