AngularJS- ng-classDirektive
Beispiel
Klasse eines <div>-Elements ändern:
<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>
Definition und Verwendung
Die ng-classDirektive bindet dynamisch eine oder mehrere CSS-Klassen an ein HTML-Element.
Der Wert der ng-classDirektive kann ein String, ein Objekt oder ein Array sein.
Wenn es sich um eine Zeichenfolge handelt, sollte sie einen oder mehrere durch Leerzeichen getrennte Klassennamen enthalten.
Als Objekt sollte es Schlüssel-Wert-Paare enthalten, wobei der Schlüssel der Klassenname der Klasse ist, die Sie hinzufügen möchten, und der Wert ein boolescher Wert ist. Die Klasse wird nur hinzugefügt, wenn der Wert auf true gesetzt ist.
Als Array kann es eine Kombination aus beidem sein. Jedes Array-Element kann entweder ein String oder ein Objekt sein, wie oben beschrieben.
Syntax
<element ng-class="expression"></element>
Unterstützt von allen HTML-Elementen.
Parameterwerte
| Value | Description |
|---|---|
| expression | An expression that returns one or more class names. |