indexing - Angularjs - 如何有条件地应用不同的类来重复指令

Question

<tr>我需要根据$index重复指令将不同的类应用于 a 。例如

<table>
   <tr ng-repeat="model in list" class="xxx">
       <td>...</td>
   <tr>
</table>

我需要<tr>根据索引是偶数还是奇数来应用不同的样式。

我怎么能解决这个问题？

Answer 1

通常你会像这样使用 ngClassOdd ( http://docs.angularjs.org/api/ng.directive:ngClassOdd ) 和 ngClassEven ( http://docs.angularjs.org/api/ng.directive:ngClassEven ) 指令：

<tr ng-repeat="item in items" ng-class-odd="'class1'" ng-class-even="'class2'">

这是 jsFiddle：http: //jsfiddle.net/pkozlowski_opensource/hNHJ4/1/

不幸的是，当删除行时，上述指令无法正常工作：https ://github.com/angular/angular.js/issues/1076

作为一种解决方法，您可以将 ngClass 指令 ( http://docs.angularjs.org/api/ng.directive:ngClass ) 与中继器公开的 $index 变量一起使用：

<tr ng-repeat="item in items" ng-class="{class1 : $index%2==0, class2 : !($index%2==0)}">

这是 jsFiddle：http: //jsfiddle.net/pkozlowski_opensource/am7xs/

它不是超级干净，但可以改进（例如，通过在根范围内公开一个函数，例如：

ng-class="getClass($index,'class1','class2')"

直到提到的错误被修复

Answer 2

如果这只是为了造型，你可以只使用 CSS

tr:nth-child(odd) { ... }
tr:nth-child(even) {...}

有关示例，请参见http://jsfiddle.net/5MSDC/