javascript - AngularJS - 在 ngRepeat 中重置 ngInit

Question

假设以下 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 已经从迭代 var1 中“知道”test2，所以该值保持为 2。

注意:请不要给出建议更改 JSON 结构或类似内容的答案 - 因为我无法做到这一点。我已经尝试像这里建议的那样复制对象:angularjs - ngRepeat with ngInit - ngRepeat doesn't refresh rendered value - 但这不起作用。我认为这是因为 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 演示中，按钮“Change”将迭代的赋值更改为 var2，“Change Back”将其更改回var1).

Answer 1

一种解决方案是确保您为 JSON 中的每个项目生成唯一的 ID。当然你不能像你说的那样改变你的 JSON，但是你可以强制 angularJS 生成一个。

把它放在你的重复循环中:

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

只要该数据组合是唯一的，您的循环就会正常工作。

文档中的更多信息:

For example: item in items track by $id(item). A built in $id() function can be used to assign a unique $$hashKey property to each item in the array. This property is then used as a key to associated DOM elements with the corresponding item in the array by identity. Moving the same object in array would move the DOM element in the same way in the DOM.

编辑另一个解决方案是稍微改变你的循环，不要使用 ng-init相反，像这样获取您的值:

<div ng-repeat="iter in iterateOver " >
    {{iter.name}}: {{getValForIter(iter).value}}
</div>