AngularJS、CSS：特定のテーブル行をハイライトする

Question

特定のテーブル行をハイライトする方法はありますか？

は、私はテーブルのセットを持っている場合例えば例えば角度コード：

angular.module('myApp', []).controller('myTest', function($scope) { 

var data = []; 
for(var i = 0; i < 10; i++) { 
     data[i] = i; 
} 
$scope.data = data; 

}); 

HTML：

<table ng-app="myApp" ng-controller="myTest"> 
<tr ng-repeat="x in data"> 
     <td > {{ x }} </td> 
</tr> 
</table> 

http://jsfiddle.net/omarjmh/Lvc0u55v/1895/

ようにそれを行うには、とにかくあり

x = 1の場合 次に CSS：ハイライト：青 ？

ありがとうございます！

Answer 1

使用ngStyle：

tr ng-repeat="x in data" ng-style="{'background-color': (x === 1 ? 'blue' : 'white')}" 

Answer 2

あなたも$を使用することができますし、このための$奇妙。

angular.module('myApp', []).controller('myTest', function($scope) { 
 

 
var data = []; 
 
for(var i = 0; i < 10; i++) { 
 
     data[i] = i; 
 
} 
 
$scope.data = data; 
 

 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app = "myApp"> 
 
    <div ng-controller="myTest"> 
 
<table > 
 
<tr ng-repeat="x in data" ng-style="{'background-color': ($even ? 'green' : 'red')}"> 
 
     <td > {{ x }} </td> 
 
</tr> 
 
</table> 
 
    </div> 
 
</div>

Answer 3

あなたは、両方の作品

tr:nth-child(even) { 
    background-color: #000000; 
} 

が偶数/奇数、CSSを使って、それを達成することができます。

や角、

であなたは、このために、角度指令ngClassEvenとngClassOddを使用する必要があります。

は

http://docs.angularjs.org/api/ng.directive:ngClassEven

http://docs.angularjs.org/api/ng.directive:ngClassOdd