Question

我很难理解angularjs中ng-repeat的跟踪表达方式是如何工作的。文档非常稀缺：http://docs.angularjs.org/api/ng/directive/ngRepeat

您能解释一下这两段代码之间的区别在于数据绑定和其他相关方面吗？

with：track by $index

<!--names is an array-->
<div ng-repeat="(key, value) in names track by $index">
  <input ng-model="value[key]">                         
</div>

没有（相同的输出）

<!--names is an array-->
<div ng-repeat="(key, value) in names">
   <input ng-model="value[key]">                         
</div>

Answer 1

如果您的数据源有重复的标识符，则可以track by $index

例如：$scope.dataSource: [{id:1,name:'one'}, {id:1,name:'one too'}, {id:2,name:'two'}]

在使用＆＃39; id＆＃39;时，您无法对此集合进行迭代作为标识符（重复ID：1）。

工作

<element ng-repeat="item.id as item.name for item in dataSource">
  // something with item ...
</element>

但是，如果使用track by $index：

，则可以

<element ng-repeat="item in dataSource track by $index">
  // something with item ...
</element>

Answer 2

简短摘要：

track by用于将您的数据与ng-repeat生成的DOM生成（主要是重新生成）相关联。

当你添加track by时，你基本上告诉angular在给定集合中为每个数据对象生成一个DOM元素

这在分页和过滤时，或者在ng-repeat列表中添加或删除对象的任何情况下都很有用。

通常，没有track by angular会将DOM对象与集合链接起来，方法是将一个expando属性 - $$hashKey - 注入到JavaScript对象中，然后重新生成它（并重新关联一个DOM对象）随着每一次变化。

完整说明：

更实用的指南：

（track by以angular＆gt; 1.2提供）

Answer 3

如果您使用标识符跟踪的对象（例如$ index）而不是整个对象，并且稍后重新加载数据，则ngRepeat 将不会重建DOM元素对于已呈现的项目，即使集合中的JavaScript对象已替换为新对象。