foreachを使用しているときにKnockoutJS observableArrayバインディングが更新通知されない

Question

私はobservableArrayでforeachバインディングを使用すると、observableArrayに加えられた変更が画面に反映されないことがあります。

この様結合ルックス：

<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が「複合型」であることです。これは、各要素が名前と役割を含むオブジェクトで構成されていることを意味します。これは違いをもたらすだろうか？

誰でもこの作業をしてください。

Answer 1

observableArray自動的にその内容が観測ことはありません。

キーポイント：オブジェクトが配列であるobservableArrayトラック、それらのオブジェクト

の ない状態が単純にオブジェクトを置きますobservableArrayは、そのオブジェクトのプロパティ自体をすべて観測可能にするわけではありません。 もちろん、 であれば、これらのプロパティを観測可能にすることができますが、それは 独立した選択肢です。 observableArrayはオブジェクトを追跡するだけで、オブジェクトが追加または削除されたときにリスナーに通知します（ ）。

あなたのビューモデルを更新し、name、観察を行った場合、あなたのコードは、あなたが期待どおりに動作するはずです

（http://knockoutjs.com/documentation/observableArrays.htmlから）：配列内の項目はように観察する必要が

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());