Instrukcja AngularJS ng-class

Definicja i użycie

ng-class Instrukcja służy do dynamicznego przypisywania jednej lub kilku klas CSS do elementu HTML.

ng-class Wartością instrukcji może być ciąg znaków, obiekt lub tablica.

Jeśli jest to ciąg znaków, powinien zawierać jedną lub kilka nazw klas rozdzielonych spacjami.

Jako obiekt, powinien zawierać pary klucz-wartość, gdzie klucz to nazwa klasy, którą chcesz dodać, a wartość to wartość logiczna. Klasa zostanie dodana tylko wtedy, gdy wartość ustawiona jest na true.

Jako tablica, może być kombinacją obu. Każdy element tablicy może być stringiem lub obiektem opisanym powyżej.

Przykład

Zmień klasę elementu <div>:

<select ng-model="home">
    <option value="sky">Sky</option>
    <option value="tomato">Tomato</option>
</select>
<div ng-class="home">
    <h1>Witaj w domu!</h1>
    <p>Lubię to!</p>
</div>

Spróbuj sam

Gramatyka

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

Wszystkie elementy HTML obsługują to.

Parametry

Parametry Opis
expression Wyrażenie zwracające jedną lub kilka klas.