AngularJS ng-class 指令

AngularJS 實例

修改 <div> 元素的類:

<select ng-model="home">
??? <option value="sky">Sky</option>
??? <option value="tomato">Tomato</option>
</select>

<div ng-class="home">
??? <h1>Welcome Home!</h1>
??? <p>I like it!</p>
</div>

運行代碼 ?

定義和用法

ng-class 指令用于給 HTML 元素動態(tài)綁定一個或多個 CSS 類。

ng-class 指令的值可以是字符串，對象，或一個數(shù)組。

如果是字符串，多個類名使用空格分隔。

如果是對象，需要使用 key-value 對，key 為你想要添加的類名，value 是一個布爾值。只有在 value 為 true 時類才會被添加。

如果是數(shù)組，可以由字符串或?qū)ο蠼M合組成，數(shù)組的元素可以是字符串或?qū)ο蟆?/p>

語法

<element ng-class="expression"></element>

所有的 HTML 元素都支持。

參數(shù)值

值	描述
expression	表達式返回一個或多個類名。

AngularJS 參考手冊

其他擴展

上一篇：AngularJS ng-checked 指令下一篇：AngularJS ng-class-even 指令