angular中ng-repeat使用笔记

ng-repeat = 'item in items'

当items是一个简单数组时,如果数组中有重复数据,会报错.这是因为:出于性能考虑(可能还有其他因素),ng-repeat时会有一个默认的keep track函数来维护视图中dom元素和可遍历对象的一一对应关系,这样当可遍历对象发生变化,例如往数组中push一个值后,视图中的所有dom元素不必全部重新渲染一遍

所以如果你想repeat一个包含重复数据的数组只需要修改默认的'keep track'函数,可以这样写:

ng-repeat = 'item in items track by $index'

性能优化

当遍历一个对象数组时,可能通常会这样写:

<div ng-repeat="model in collection"> {{model.name}}</div>

这时默认会trackmodel对象,我们可以手动的更改track来减少数据更改时,重新渲染dom元素的工作量(即使collection中对象已经被替换成了新的),这在collection很大时性能提升是显著的

如果model对象中存在唯一的id属性,我们可以这样写:

<div ng-repeat="model in collection track by model.id"> {{model.name}}</div>

如果没有唯一的id属性,我们同样可以加上track by $index

track by必须放在表达式的最后

关于ng-repeat-start/ng-repeat-end

必须配套使用
目前给我的感觉是避免了多余div节点的引入