AngularJS实战之ng-repeat的详细用法

一、基本语法
{{$index}}:获取元素的下标。
{{$first}}:判断当前元素是否是第一个元素,是则为true,否则:false;
{{$last}}:判断当前元素是否是最后一个元素,是则为true,否则:false;
{{$middle }}:判断当前元素是否是中间元素,,是则为true,否则:false;
{{ $odd}}:判断当前元素是否是奇数,,是则为true,否则:false;
{{ $even}}:判断当前元素是否是偶数,,是则为true,否则:false;

二、嵌套ng-repeat
获取父级的属性用{{$parent.$index}},当然一个也可以多个$parent方式获取父级的父级。
三、排序、过滤
  
  	
{{item.letter}}
{{item.letter}}
{{item.name}}
{{item.name}}

四、错误解决
AngularJS实战之ng-repeat的详细用法_第1张图片

这个错误是angular数组中有两个级以上相同的数字,想要解决需要使用track by $index来规避这个错误,也可以使用当前元素中的内容来充当例如ng-repeat="item in list track by item.id "
五、坑
我们很多时候会使用angular的$index当作下标进行一系列操作,但是这里要注意了,当我们使用了filter过滤了数组会导致下标不准确,此时我们应该使用元素本身作为条件操作。
end:例子代码见附件

转载于:https://www.cnblogs.com/baryon/p/9611428.html

你可能感兴趣的:(AngularJS实战之ng-repeat的详细用法)