angularJs中的ng-repeat的使用

最近项目中要求做一个下拉的城市选择的功能，由于项目使用了AngularJs框架，所以自然而然的想到ng-repeat指令，免去了自己写循环的烦恼。所以总结一下ng-repeat的使用方法：

代码如下

    

    

    

    

        

    

    

        

  

    

城市选择

请选择城市
{{item.name}}

 

这应该是最简单的ng-repeat的使用了。默认在ng-repeat的时候每一个item都要保证是唯一的，否则console就会打出error告诉你哪个key/value是重复的，如下：

$scope.items = [1，2，2，3，4];
这个数组2就重复了，html这么遍历它

{{ item }}

控制台就会抛出一个错误：

官网明确给出是因为值重复了：
Duplicates in a repeater are not allowed. Use 'track by' expression to specify unique keys. Repeater: item in items, Duplicate key: string:blue, Duplicate value: 2

但是，正常的业务里数组有重复的值是很正常的，难道有重复值的数组要硬要搞成唯一的ng-repeat才能遍历，那这样的话很多业务场景就不能使用ng-repeat了；继续往下看，发现官网给了一个解决的方案

于是按照这个方案改了一下

{{ item }}

刷新网页，内容被正常解析。