KnockoutJS observableArray綁定在使用foreach時沒有被通知更新

我有一個問題，如果我使用foreach綁定一個observableArray，我沒有看到對observableArray所做的更改反映在屏幕上。KnockoutJS observableArray綁定在使用foreach時沒有被通知更新

的結合看起來是這樣的：

<div data-bind="foreach: items"> 
    <p> 
    <input data-bind="value: name" /> 
    </p> 
    <p>Name: <span data-bind="text: name"></span></p> 
    <br /> 
</div>

的observableArray看起來是這樣的：

this.items = ko.observableArray([ 
    { name: 'Person 1', role: 'Sales' }, 
    { name: 'Person 2', role: 'Accounts' }, 
    { name: 'Person 3', role: 'Admin' } 
    ]);

下面是一個的jsfiddle來說明這個問題： https://jsfiddle.net/ue3opdd2/2/

的HTML被拆分2個部分使用水平中斷。第1部分是使用可觀察的綁定。如果您修改文本框，則會看到下面的span元素中反映的更改。這是行得通的。

在第2節是完全相同的主體，但使用observableArray和foreach綁定。例如，如果更改「Person 1」文本框中的值，我希望看到此更改反映在下面的span元素中，但它不起作用（它保留爲「Name：Person 1」）。

我已經把一個調試輸出放在屏幕的底部，我也沒有看到那裏的observableArray更新的值。

我能看到的主要區別是observableArray是一個「複雜類型」。我的意思是每個元素都由一個包含名稱和角色的對象組成。這會有所作爲嗎？

任何人都可以幫助我得到這個工作嗎？

來源

2017-01-16 Laurence Frost

數組中的項目需要觀察爲好。 – Nkosi

observableArray不會自動使其內容可觀察到：

關鍵點：一個observableArray軌道哪些對象是在陣列中，不這些對象

的狀態乾脆把一個對象成observableArray不會使所有對象的屬性本身都是可觀察的。當然，如果你願意，你可以使這些屬性可觀察，但這是一個獨立的選擇。 observableArray只跟蹤它保存的對象，並在添加或刪除對象時通知監聽器。

（從http://knockoutjs.com/documentation/observableArrays.html）

如果您更新視圖模型，使name觀察到的，你的代碼應該工作的方式，你希望：

var ViewModel = function() { 
    this.item = ko.observable('Test name'); 

    this.items = ko.observableArray([ 
    { name: ko.observable('Person 1'), role: 'Sales' }, 
    { name: ko.observable('Person 2'), role: 'Accounts' }, 
    { name: ko.observable('Person 3'), role: 'Admin' } 
    ]); 
}; 

ko.applyBindings(new ViewModel());

來源

2017-01-16 18:42:13

添加我的答案時，你提交了你的。 :) – Nkosi

欣賞編輯！看起來好多了，作爲一個適當的blockquote。 –

非常感謝答覆 - 我以爲我做錯了什麼，但我現在可以看到這是正確的行爲。我寫了這個超簡單的例子來演示這個問題，但實際上observableArray來自服務器的JSON。是否有推薦的方法來獲取JSON對象，使用該JSON數據更新observableArray，並使其中一個子字段可見？ –

KnockoutJS observableArray綁定在使用foreach時沒有被通知更新

回答

相關問題