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динамически привязывает один или несколько классов CSS к элементу HTML.

Значение ng-classдирективы может быть строкой, объектом или массивом.

Если это строка, она должна содержать одно или несколько имен классов, разделенных пробелами.

Как объект, он должен содержать пары ключ-значение, где ключ — это имя класса, который вы хотите добавить, а значение — логическое значение. Класс будет добавлен только в том случае, если установлено значение true.

Как массив, это может быть комбинация обоих. Каждый элемент массива может быть либо строкой, либо объектом, описанным выше.


Синтаксис

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

Поддерживается всеми элементами HTML.


Значения параметров

Value Description
expression An expression that returns one or more class names.