AngularJS（三）ng-repeat的坑

ng-repeat是用来遍历数组的：

<li ng-repeat="product in products">
    {{product}}
</li>

products：

$scope.products = ["Milk","Bread",'Juice'];

上述使用是完全没有问题的，但是当数组出现重复的值时，会出现什么情况呢？

$scope.products = ["Milk","Bread",'Juice',"Milk","Milk"];

数组中出现了三个"Milk"，浏览器无法解析，就会出异常。

官方解释：Duplicates in a repeater are not allowed. Use 'track by' expression to specify unique keys.

于是在ng-repeat中添加了track by $index：

<li ng-repeat="product in products track by $index">
    {{product}}
</li>

这样就不会出错了，三个"Milk" 都能显示出来.

这个问题一般是在遍历数组，数组内有相同字符串时才会出现，换成对象或者数字，都不会出现这个问题，因为数组中的值用===判断两个值相等，就会因为重复而异常。