AngularJS ng-class-ohje

Määrittely ja käyttö

ng-class Ohjeesta käytetään dynaamisesti yhden tai useamman CSS-luokan sitomista HTML-elementtiin.

ng-class Ohjeen arvo voi olla merkkijono, objekti tai taulukko.

Jos se on merkkijono, se tulisi sisältää yhden tai useamman luokan nimen, jotka ovat eroteltu välilyönnillä.

Objektina sen tulisi sisältää avain-arvoja, joissa avain on haluamasi luokan nimi ja arvo on totuusarvo. Luokka lisätään vain, jos arvo on asetettu true:ksi.

Se voi olla molempien yhdistelmä tietueena. Jokainen tietue voi olla yllä kuvatun tyyppinen merkkijono tai objekti.

Esimerkki

Muuta <div> -elementin luokkaa:

<select ng-model="home">
    <option value="sky">Sky</option>
    <option value="tomato">Tomato</option>
</select>
<div ng-class="home">
    <h1>Tervetuloa kotiin!</h1>
    <p>Mielenkiintoista!</p>
</div>

Kokeile itse!

Syntaksi

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

Kaikki HTML-elementit tukevat tätä.

Parametrit

Parametrit Kuvaus
expression Palauttaa yhden tai useamman luokan ilmentymän ilmaisun.