AngularJS ng-class 指令

定义和用法

ng-class 指令用于动态地将一个或多个 CSS 类绑定到 HTML 元素。

ng-class 指令的值可以是字符串、对象或数组。

如果它是字符串,它应该包含一个或多个以空格分隔的类名。

作为对象,它应该包含键值对,其中键是您想要添加的类的类名,而值是布尔值。只有当值设置为 true 时,才会添加该类。

作为数组,它可以是两者的组合。每个数组元素可以是上述描述的字符串或对象。

实例

更改 <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>

亲自试一试

语法

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

所有 HTML 元素都支持。

参数

参数 描述
expression 返回一个或多个类名的表达式。