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

Question

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

<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/

它不是 super 干净，但可以改进(例如，通过在根作用域中公开函数，例如:

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

直到提到的错误被修复