无法在数组上进行双向数据绑定答案

【问题标题】：Not able to make two way data binding work on an array无法在数组上进行双向数据绑定
【发布时间】：2017-06-24 05:55:20
【问题描述】：

我正在尝试使用 AngularJS 创建一种拖放游乐场。代码在 plunker 上。要理解这个问题，大多数情况下你需要看到 plunker。

https://plnkr.co/edit/i82UOOqHRSJyEPN9293E

我正在尝试在这里创建类似节点的结构，可以将其拖到右侧的操场上。

在拖动时，我将节点 ID 添加到 $scope 中的 nodeChain 变量中。现在我在 UI 中使用 ng-repeat 迭代 nodeChain 数组，我在其中绘制节点只是为了检查添加到链中的节点是否正确反映。

然而，

我没有看到 nodeChain 更新自 watchCollection 日志以及在 Playground 上绘制的节点在添加新节点时没有更新。

谁能告诉我为什么绑定没有生效？

提前致谢！

【问题讨论】：

标签： javascript angularjs data-binding

【解决方案1】：

您需要触发 $digest 循环来更新值。当$digest 循环开始时，它会触发每个观察者。这些观察者检查范围模型的当前值是否与上次计算的值不同。如果是，则执行相应的侦听器函数。因此，如果视图中有任何表达式，它们将被更新。

  if (!Bounds.within(event.pageX, event.pageY, leftPane)) {
                    scope.$parent.nodeChain.push(NodeChain.getNodeFromId(attr.nid))
                    scope.$apply();
            }

工作的Plunker：https://plnkr.co/edit/SNNsVOZps5Fy35dAQIqk?p=preview

您在控制台中收到 ng-repeat dupes 错误，因为您的数组 nodeChain 中有重复值。

【讨论】：

【解决方案2】：

如果我正确理解您的问题，您想在下面的空白处添加删除的节点。请查看plunkr。

更改范围外的模型时应添加$scope.apply()。

【讨论】：