ng-repeat用来遍历一个集合或为集合中的每个元素生成一个模板实例。集合中的每个元素
都会被赋予自己的模板和作用域。同时每个模板实例的作用域中都会暴露一些特殊的属性。
$index:遍历的进度(0...length-1)。
$first:当元素是遍历的第一个时值为true。
$middle:当元素处于第一个和最后元素之间时值为true。
$last:当元素是遍历的最后一个时值为true。
$even:当$index值是偶数时值为true。
$odd:当$index值是奇数时值为true。
下面的例子展示了如何用
$odd和$even来制作一个红蓝相间的列表。记住,JavaScript中数组
的索引从
0开始,因此我们用!$even和!$odd来将$even和$odd的布尔值反转。
<!doctype html> <html ng-app="myApp"> <head> <link rel="stylesheet" href="//cdn.jsdelivr.net/foundation/4.3.2/css/foundation.min.css"> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0-rc.2/angular.js"></script> </head> <body> <ul ng-controller="PeopleController"> <li ng-repeat="person in people" ng-class="{even: !$even, odd: !$odd}"> {{person.name}} lives in {{person.city}} </li> </ul> </body> </html>
.odd { background-color: blue; } .even { background-color: red; }
angular.module(‘myApp‘, []) .controller(‘SomeController‘, function($scope) { $scope.person = {}; });
原文:http://www.cnblogs.com/ByronWu12345/p/4853084.html