2

私は非常に一般的なテーブルアウトプッターを開発しようとしています-行または列の数が設定されていません。そのため、ネストされた ng-repeat 属性があります。

<table>
    <tr ng-repeat="row in rowList">
        <td ng-repeat="col in colList">{{printCell(row,col)}}</td>
    </tr>
</table>

それはうまくいっています！それに応じて行の背景色を使用ng-class-evenして変更しようとするまで。ng-class-odd

タグにng-class-***ステートメントを配置すると、列の色が交互になります。td

タグにng-class-***ステートメントを配置すると、クラスの割り当ては取得されません。それらはすべてデフォルトのままです。tr

行の色を交互にしたい。どうすればこれを行うことができますか？

編集：

これを削除してください、誰か？問題は、私の css クラスが、クラスが td タグに設定されていることを指定していたことでした。

4

1 に答える 1

26

ng-class-oddandの値はng-class-even、文字列ng-class-odd="'myClass'"または式にすることができますng-class-odd="{myClass: boolExpression}"

また：

角度 1.2+:ng-class="{even: $even, odd: $odd}"

<table>
    <tr ng-repeat="row in rowList" ng-class="{even: $even, odd: $odd}">
        <td ng-repeat="col in colList">{{printCell(row,col)}}</td>
    </tr>
</table>
<hr />

角度 < 1.2ng-class="{even: !($index%2), odd: ($index%2)}"

<table>
    <tr ng-repeat="row in rowList" ng-class="{even: !($index%2), odd: ($index%2)}">
        <td ng-repeat="col in colList">{{printCell(row,col)}}</td>
    </tr>
</table>

例: http://jsfiddle.net/TheSharpieOne/JYn7S/1/

于 2013-09-10T18:16:01.573 に答える