AngularJS, CSS: Hervorhebung einer bestimmten Tabellenzeile

Question

Gibt es eine Möglichkeit, eine bestimmte Tabellenzeile hervorzuheben?

Ich habe eine Tabelle und einen Satz, wenn Winkelcodes zum Beispiel zum Beispiel:

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/

Gibt es trotzdem, es zu tun, wie

wenn x gleich ist 1 dann css: highlight tr: blau ?

Danke!

Answer 1

Verwendung ngStyle:

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

Answer 2

Sie $ selbst und $ ungerade für diese verwenden können.

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

Sie es,

mithilfe von CSS erreichen

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

gerade/ungerade beide Werke.

Oder mit eckiger,

Sie sollten hierfür die Winkel Richtlinien ngClassEven und ngClassOdd werden.

Werfen Sie einen Blick in die Dokumentation Abschnitt, wie sie

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

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