2

KnockoutJSのネストされたobservableArrayに追加/削除しようとしています。配列にはいくつかの要素があり、それぞれに属性オブジェクト、型オブジェクト、およびオブジェクトを保持するattributeValue配列があります。つまり、ネストされた配列です。

allAttributes配列はobservableArrayです。次に、attributeValuesをko.observableArray（[]）として新しいViewModel（attributeValueViewModel）を作成することにより、attributeValue配列を監視可能にしようとしました。

2つのノックアウト関数（機能しません）を作成し、その配列に値を追加/削除しようとしています。問題は、配列がネストされているため、this.attribute.idを介してattributeIDにアクセスする必要があることです。self.allAttributes [i] .attributeValues [j]は、追加/削除するオブジェクトである必要があります...ここで、i=attributeIDおよびj=属性の値オブジェクトのインデックス

これらの機能が機能しないのはなぜですか？

これが私のフィドルです：http：//jsfiddle.net/M6Hqj/2/

4

1 に答える 1

1

まず、内部ビュー モデルの監視可能な関数を上書きしています。たとえば、を割り当てる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呼び出しは実際には配列内の特定のレコードを参照するため、実行すると、オブジェクト プロパティが見つかりません。したがって、関数をオブジェクトにシフトし、代わりに を次のように使用します。attributeValuesthis.attributeValues.splice()attributeValuesattributeValueViewModelselfthis

//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/

(これらの変更では、まだバグがあるため、要素を正しく追加/削除するためにロジックを変更する必要があることに注意してください)

于 2012-10-04T02:09:07.933 に答える