Angularjs markup table row or colums depends on value
Is there any way to add classes on row or column depends on values. If column "anzahl" is null, the row background-color has to be "gray" and the column "anzahl" background-color goes to "red.
<body ng-app ng-init='articles = [
{"id":"1","name":"A&R","type":"P77 ","anzahl":"0"},
{"id":"2","name":"Accuphase","type":"AC5 ","anzahl":"1"},
{"id":"3","name":"Acoustical Systems","type":"Archon","anzahl":"1"}
]'>
<div class="container">
<table class="table">
<tr ng-repeat="article in articles">
<td>{{article.name}}</td>
<td>{{article.type}}</td>
<td>{{article.anzahl}}</td>
</tr>
</table>
</div>
</body>
Answer
You can use ng-class="{'class': expession}" in your case
CSS
.custom-class{
background-color: gray
}
.default-color{
background-color: red
}
<table class="table">
<tr ng-repeat="article in articles" ng-class="{'custom-class': article.anzahl == null, 'default-color': article.anzahl != null}">
<td>{{article.name}}</td>
<td>{{article.type}}</td>
<td>{{article.anzahl}}</td>
</tr>
</table>
Thanks.