Question

我是Angularjs的新秀。最近我在Angularjs网站上阅读指南并且有些困惑。

在angularjs API文档中关于import matplotlib.pyplot as plt match = ("L8 <Mx JK31 (Mx)") with open("test.txt") as fin: print(' : {}', fin.name) for line in fin: if match in line: line = line.strip.split() time = line[2] size = line[9].strip(",") plt.plot(time, data_size)，它说：

如果您正在处理具有标识符属性的对象，则应按标识符而不是整个对象进行跟踪。如果您以后重新加载数据，ngRepeat将不必为已经呈现的项重建DOM元素，即使集合中的JavaScript对象已替换为新对象。对于大型集合，这可以显着提高渲染性能。如果您没有唯一标识符，则按$ index跟踪也可以提高性能。

我不明白这个内容：

如果您以后重新加载数据，ngRepeat将不必为已呈现的项重建DOM元素，即使集合中的JavaScript对象已替换为新对象。

这句话是什么意思？能给我举个例子？非常感谢你！

Answer 1

假设您有ng-repeat构建两个这样的元素：

<div></div>
<div></div>

然后再向对象添加三个元素以获取此元素：

<div></div>
<div></div>
<div></div>
<div></div>
<div></div>

关键是，前两个div不会从DOM中删除，然后重新创建并重新插入，但只会添加三个新的。

如果你的对象的前两个元素被改变了，但是他们被跟踪的元素保持不变（因此他们推荐$ index） - 两个DOM元素（div）仍然是相同的完好无损，只更换内容。

当然，我给你的小例子中没有内容，但你明白了。将track by变量视为＆＃34;胶水＆＃34;保持DOM到位。

Answer 2

使用和不使用ngRepeat时，

track by行为会发生变化。

当集合发生变化时：

没有track by：

Angular重建DOM（销毁并再次创建每个DOM元素）。

使用track by：

Angular检索每个项目的DOM元素并更新值。

正如医生所说：

对于大型集合，这可以显着提高渲染性能。

在this article中很好地解释了这种行为。

ng-repeat渲染如何在引擎盖下工作？

2 个答案: