具有相關類的角度多重布爾條件

Question

我試圖根據狀態擁有不同的類，如何根據不同的條件擁有不同的類？

<i ng-class="'iconA': state == 100, 'iconB': state == 200, 'iconC': state == 300"></i> 

Answer 1

從Angular docs for ngClass：

評價的結果可以是代表空間分隔的類名的字符串，陣列，或地圖上的類名到布爾值的。在地圖的情況下，值爲truthy的屬性的名稱將作爲css類添加到元素中。

你現在已經接近地圖了。你只需要用大括號包起來。

<i ng-class="{'iconA': state == 100, 'iconB': state == 200, 'iconC': state == 300}"></i> 

Answer 2

我想你可能只是在你的雙引號內丟失了一些大括號 - 你能試試嗎？

<i ng-class="{ 
    'iconA': state == 100, 
    'iconB': state == 200, 
    'iconC': state == 300 
}"></i> 

我們做了非常類似的東西最近這對我們的工作還有：

<button class="date-picker__day" ng-class="{ 
    'date-picker__day--this-month': ctrl.isActiveMonthForDay(day), 
    'is-selected': ctrl.isSelectedDay(day), 
    'is-active': ctrl.isActiveDay(day), 
    'is-today': ctrl.isToday(day), 
    'is-disabled': !ctrl.isDateAllowed(day), 
}"></button>