[英]ng-if in ng-repeat angularjs
我需要通过ng-repeat中的champ值定义不同的样式,我尝试这样:
<thead>
<tr><th>#</th><th>Nom</th><th>Ville</th><th style="width: 50%;">Lignée</th></tr>
</thead>
<tbody>
<tr ng-repeat="alternate1 in alternateViewText1.features | orderBy:'fiche.id*1'">
<td>{{alternate1.fiche.id}}</td>
<td ng-if="alternate1.properties.statut_activite == 'yes'" style="color: green;">{{alternate1.properties.nom}}</td>
<td ng-if="alternate1.properties.statut_activite == 'no'" style="color: red;">{{alternate1.properties.nom}}</td>
<td>{{alternate1.properties.ville}}</td>
<td>{{alternate1.properties.lignee}}</td>
</tr>
</tbody>
它不起作用(什么也没显示)
如何自动定义具有特定值的样式?
您可以为特定样式创建一个类,并使用ng-class
这样的:
CSS:
.green
{
color:green;
}
.red
{
color:red;
}
html :
<td data-ng-class="{'green' : alternate1.properties.statut_activite == 'actif', 'red': alternate1.properties.statut_activite == 'inactif'}">{{alternate1.properties.nom}}</td>
您在测试中使用了错误的值
更换yes
由actif
并no
通过inactif
范例:
<td ng-if="alternate1.properties.statut_activite == 'actif'" style="color: green;">{{alternate1.properties.nom}}</td>
<td ng-if="alternate1.properties.statut_activite == 'inactif'" style="color: red;">{{alternate1.properties.nom}}</td>
PS:
ssilas777的答案是执行此CSS类切换的最佳方法
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.