1

我目前正在开发一个需要显示任意尺寸的可编辑表格的项目。我正在使用 AngularJS，但是由于表可能会变得非常大，我希望如果我不使用某种形式的绑定一次，事情会变得很慢。问题是，据我所知，绑定一次是绝对的——我希望它实际上保留或至少恢复当前正在编辑的行的所有观察者。

这是我目前如何执行此操作的基本想法。

<tr ng-repeat="row in rows track by key" hackonce>
  <td ng-repeat="col in cols">
    <div ng-click="editStuff()">{{contents}}

directive('hackonce', function() etc
  link: function(scope, elem, attrs) {
    if (!scope.row.editing)
       setTimeout(function(){ scope.$destroy() }, 0)
  }

我正在从其各种标识符的行上生成一个字符串键。当项目被标记为编辑时，控制器将其切换为副本并更改其密钥以包含最终将成为事务锁定数据的内容。这会触发 ng-repeat 中的替换，并且下次使用替换的行数据构造 tr 时，范围保持不变并在您编辑内容时更新。

不知何故，它确实有效（到目前为止）。它让我从一个小名单上的 500 多个观察者减少到 100 个以下，剩下的主要是顶级控件，所以我希望它能够很好地扩展。即使范围消失了，它似乎也保留并正确清理了 ng-click 侦听器等。

然而，我只是简单地把它打出来，我觉得它可能会导致比我更了解这个库的理智的人呕吐。我想知道是否有更清洁和/或更安全的方法来做同样的事情。我正在寻找的是一种更好的方法来有条件地绑定一次，或者有一个元素/范围，否则会根据一些暴露​​的标志跳过它的 $digest 本身及其所有子项。

有什么方法可以做到这一点，而不涉及将切肉刀带到作用域或手动重新附加我希望通过 Angular 避免的所有 jQuery 垃圾？

4

1 回答 1

1

如果没有更多的实现细节，这有点困难，但我假设您正在使用某种机制来显示/隐藏每一行的只读/可编辑元素？如果你习惯ng-if这样做，它会将元素附加到 DOM 并在条件为时重新绑定true并在 时分离false。

所以，像：

<td ng-repeat="col in cols">
  <span ng-if="!isEditing(row)">Read-only stuff here</span>
  <span ng-if="isEditing(row)">Editable stuff here.</span>
</td>

我在这里创建了一个非常简单的示例：http://plnkr.co/edit/SkdgTuK5UvEEsZmzWat6? p =preview

于 2015-03-24T02:33:15.070 回答