ngClass

假設你需要顯示使用者的狀態，並且你可以使用幾種可能的 CSS 類。Angular 使得從幾個可能的類列表中進行選擇非常容易，這些類允許你指定包含條件的物件列表。Angular 能夠根據條件的真實性使用正確的類。

你的物件應包含鍵/值對。鍵是一個類名，當值（條件）計算為 true 時將應用該類名。

<style>
    .active { background-color: green; color: white; }
    .inactive { background-color: gray; color: white; }
    .adminUser { font-weight: bold; color: yellow; }
    .regularUser { color: white; }
</style>

<span ng-class="{ 
    active: user.active, 
    inactive: !user.active, 
    adminUser: user.level === 1, 
    regularUser: user.level === 2 
}">John Smith</span>

Angular 將檢查 $scope.user 物件以檢視 active 狀態和 level 編號。根據這些變數中的值，Angular 會將匹配樣式應用於 <span>。