3

次の JSON 構造を想定します。これは、現在作業しているものから大幅に単純化されています。

$scope.var1 = {
    "test1": {
        "name": "test1",
        "belongsTo": "var1",
        "additionalInformation": "blabla"
    },
    "test2": {
        "name": "test2",
        "belongsTo": "var1",
        "additionalInformation": "blabla"
    },
    "test3": {
        "name": "test3",
        "belongsTo": "var1",
        "additionalInformation": "blabla"
    }
};

$scope.var2 = {
    "test8": {
        "name": "test8",
        "belongsTo": "var2",
        "additionalInformation": "blabla"
    },
    "test2": {
        "name": "test2",
        "belongsTo": "var2",
        "additionalInformation": "blabla"
    },
    "test9": {
        "name": "test9",
        "belongsTo": "var2",
        "additionalInformation": "blabla"
    }
};

$scope.valuesVar1 = {
    "test1": {
        "value": 1
    },
    "test2": {
        "value": 2
    },
    "test3": {
        "value": 3
    },
};

$scope.valuesVar2 = {
    "test8": {
        "value": 4
    },
    "test2": {
        "value": 5
    },
    "test9": {
        "value": 6
    },
};

Var1 と Var2 は、常に同じ構造を持つデータを表します。valuesVar1 と valuesVar2 も同じです。構造は同じで、var1 と var2 の追加情報が含まれています。

var1 を反復処理し、ng-init を使用して valuesVar1 から値を取得しようとしています。ユーザー インタラクションでは、反復の割り当てが var2 に変更されるため、var2 を反復処理して、valuesVar2 から値を取得していることに注意してください。

問題: var2 を反復処理すると、"test2" の値が 5 になるはずです。しかし、ngInit はすでに test2 が var1 を反復することを「認識」しているため、値は 2 のままです。

注: JSON 構造などを変更するようアドバイスする回答はしないでください。ここで提案されているように、既にオブジェクトをコピーしようとしました: angularjs - ngRepeat with ngInit - ngRepeat はレンダリングされた値を更新しません- しかし、これは機能しません。ngInit がオブジェクト参照ではなく文字列値「test2」を「記憶」しているためだと思います（しかし、私はそれを本当に知りません:)）。

質問: オブジェクトの同じキーが前の反復で既に使用されている場合、反復で ngInit を再度実行するにはどうすればよいですか?

また、情報を含む jsfiddle http://jsfiddle.net/S329r/6/も用意しました。実行すると、var1 を反復処理し、次のような値を出力します。

test1: 1
test2: 2
test3: 3

これまでのところとても良いです、私はこれを期待しています。しかし、繰り返しに var2 が割り当てられると、次のようになります。

test2: 2
test8: 4
test9: 6

ここでは、test2 が値 5 を表示することを期待しています (ヒント: jsfiddle デモでは、「変更」ボタンは反復の割り当てを に変更しvar2、「元に戻す」ボタンはそれを に戻しますvar1)。

4

1 に答える 1

4

1 つの解決策は、JSON 内の各項目に対して一意の ID を生成していることを確認することです。もちろん、あなたが言ったように JSON を変更することはできませんが、angularJS に生成させることはできます。

これを繰り返しループに入れてください：

iter in iterateOver track by $id(iter.name + iter.belongsTo)

データの組み合わせが一意である限り、ループは正しく機能します。

ドキュメントからのもう少しの情報：

例: item in items track by $id(item)。組み込みの $id() 関数を使用して、一意の $$hashKey プロパティを配列内の各項目に割り当てることができます。このプロパティは、ID によって配列内の対応する項目に関連付けられた DOM 要素へのキーとして使用されます。配列内の同じオブジェクトを移動すると、DOM 内で同じ方法で DOM 要素が移動します。

編集 別の解決策は、ループを少し変更して使用しないことですng-init 。代わりに、次のように値を取得します。

<div ng-repeat="iter in iterateOver " >
    {{iter.name}}: {{getValForIter(iter).value}}
</div>
于 2014-08-04T23:32:53.660 に答える