eine Funktion erstellen, die hinzuzufügen ist eine CSS-Klasse

Question

ich Angular bin mit und in dem app.component.ts würde Ich mag eine Funktion erstellen, die eine CSS-Klasse zu einem div fügt hinzu, die eine Klasse enthält:

Zum Beispiel:

<div class="mydiv"> 
    Another class will be injected to this div's class 
</div> 

Also, wenn ich eine Funktion erstellen:

myfunction() { 
    //Code here to add the class to the div in typescript 
} 

Wie mache ich es in Maschinenschrift?

Answer 1

Sie könnten [ngClass] verwenden, die Sie die Klassen bearbeiten können Sie jedoch von der Komponente wollen

In Komponentenklasse

arrayOfClassNames: string[] = ['big']; 

addClass(newClassName: string): void { 
    this.arrayOfClassNames.push(newClassName); 
} 

HTML-Vorlage

<div [ngClass]="arrayOfClassNames">Some text</div> 

Sie dann jede Methode erstellen können Sie hinzufügen möchten/entfernen/Klassen ersetzen.

Überprüfen Sie die vielen Möglichkeiten zu verwenden ngClass.

Answer 2

Der einfachste Weg wäre eine Bindung:

<div [class.myclass]="flag"></div> 

Und in Ihrem Controller

public flag: boolean = false; 

myFunction() { 
    this.flag = !this.flag; 
}