如何在 Angular 2+ 中使用多个有条件的类
Posted
技术标签:
【中文标题】如何在 Angular 2+ 中使用多个有条件的类【英文标题】：How to use multiple classes with condition in angular 2+ 【发布时间】：2018-12-13 14:02:49 【问题描述】：我试图在 [ngClass] 上使用一个条件来选择多个类：
<td>
<span
[ngClass]="
'badge badge-success': server.type === 'PRODUCTION',
'badge badge-danger': server.type === 'TEST',
'badge badge-warning': server.type === 'DEV'
">
</span>
</td>
我知道 [ngClass] 不适用于 ，我从 restapi django app 获取我的数据，还有什么替代方法？谢谢
【问题讨论】：
【参考方案1】：无需将 与[ngClass] 一起使用，因此只需将其删除即可。
试试这个 -
[ngClass]="
'badge badge-success': server.type === 'PRODUCTION',
'badge badge-danger': server.type === 'TEST',
'badge badge-warning': server.type === 'DEV'
">
【讨论】：
【参考方案2】：使用[ key: class[ expression ]] 处理多个条件
<span class="badge " ng-class="['PRODUCTION':'badge-success', 'TEST':'badge-danger', 'DEV':'badge-warning'[ server.type]]"></div>
【讨论】：
以上是关于如何在 Angular 2+ 中使用多个有条件的类的主要内容，如果未能解决你的问题，请参考以下文章