如何在 AngularJS 列表中高效應用條件類別？

在AngularJS 實現條件類應用

問題：

問題：

問題：

應用程式渲染數組作為無序列表，特定索引處的元素需要顯示自訂類別。如何有效地實現這一點？

• 解：

  <li ng:class="{true: 'selected', false: ''}[$index == selectedIndex]">...</li>

  要依照條件動態應用類，有幾種方法：

• 使用表達式ngClass:

  <li ng-class="{selected: $index == selectedIndex}">...</li>

  這種經典方法直接計算為布林值，如果索引與 selectedIndex 屬性匹配，則分配「selected」類別。

• 使用物件表達式ngClass:

  <li ng-class="{admin: 'enabled', moderator: 'disabled', '': 'hidden'}[user.role]">...</li>

  AngularJS 現在允許基於物件表達式進行類別分配。每個屬性名稱代表一個類，其值決定其存在。

將模型屬性對應到類別：

這種進階方法將模型屬性對應到類別名稱，提供根據任何條件分配類別的靈活性，而無需依賴ngIf/ngHide。 請記住，方法的選擇取決於您對程式碼結構和維護的特定要求和偏好。

以上是如何在 AngularJS 列表中高效應用條件類別？的詳細內容。更多資訊請關注PHP中文網其他相關文章！