AngularJS ng-class-instruktion

Definition och användning

ng-class Instruktionen används för att dynamiskt binda en eller flera CSS-klasser till HTML-element.

ng-class Värdet för instruktionen kan vara en sträng, ett objekt eller en array.

Om det är en sträng bör den innehålla en eller flera klassnamn separerade av blanksteg.

Som objekt bör det innehålla nyckelvärdepå par, där nyckeln är namnet på klassen du vill lägga till, och värdet är ett booleanvärde. Endast när värdet är satt till true läggs klassen till.

Som en array kan den vara en kombination av båda. Varje element i arrayen kan vara en av de ovan beskrivna strängarna eller objekten.

Exempel

Ändra klassen för <div>-elementet:

<select ng-model="home">
    <option value="sky">Sky</option>
    <option value="tomato">Tomato</option>
</select>
<div ng-class="home">
    <h1)Välkommen hem!</h1>
    <p>Jag gillar det!</p>
</div>

Prova själv

Syntax

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

Alla HTML-element stöder.

Parametrar

Parametrar Beskrivning
expression Returnerar en uttryck som representerar en eller flera klassnamn.