AngularJS如何在ng-repeat中$watch这些情况？

Question

我知道AngularJS在ng-repeat上设置了一些监视器。这时会设置哪种类型的监视器？

此外，有人能解释一下以下每种情况会发生什么吗？如果我有很多项，我想知道这些，以便用户不会被那些本可以用其他方式消除的监视器所拖累。

第一种情况：

<div ng-repeat="item in items">
  <div>{{item.property}}</div>
</div>

二

<div ng-repeat="item in items">
  <div>{{item.property | myFormatter}}</div>
</div>

三

<div ng-repeat="item in items">
  <div>{{format(item.property)}}</div>
</div>

四

<div ng-repeat="item in items">
  <div>{{item.something()}}</div>
</div>

- Bradford

Answer 1

每个 ng-repeat 都会在 items 上设置一个 $watch。(如果您查看 ng-repeat 源代码，大多数都是 $watch 方法的 watchExpression 函数)。每次 Angular 的 digest 循环 运行时，该 watch 函数将检查 items 中的每个 item。(请注意，在 digest 循环中，该 watch 函数可能会被调用多次)。

每个 {{}} 都会设置一个 $watch。如果像 item.property 这样的东西出现在 {{}} 中，则每个 digest 循环至少会进行一次脏检查。

如果一个函数出现在 {{}} 中，则该函数每个 digest 循环至少会被调用一次。

我不确定 x | filter，但是 这个 fiddle 似乎表明，即使 x 没有改变，过滤器也会在每个 digest 循环中至少被调用一次。

- Mark Rajcok

---

关于 x | filter 的用法有些惊人，我不理解为什么会这样。也许他们认为 filter 不是一个纯函数？ - Bradford

我也感到相当惊讶。 - Mark Rajcok

ng-repeat源代码的更新链接：https://github.com/angular/angular.js/blob/v1.6.x/src/ng/directive/ngRepeat.js。看起来他们现在使用$watchCollection进行浅层检查。谢谢Mark！ - John Lee