Angular: Bedingte Klasse mit *ngClass

Was ist falsch mit meinem Angular-Code? Ich erhalte:

Cannot read property 'remove' of undefined at BrowserDomAdapter.removeClass ...

HTML

<ol class="breadcrumb">
    <li *ngClass="{active: step==='step1'}" (click)="step='step1; '">Step1</li>
    <li *ngClass="{active: step==='step2'}"  (click)="step='step2'">Step2</li>
    <li *ngClass="{active: step==='step3'}" (click)="step='step3'">Step3</li>
</ol>
MostafaMashayekhi
Bearbeitete Frage 13. November 2018 в 7:37
Programmierung
javascript css angular angular-template angular-ng-class
8. Februar 2016 в 12:00
21 Aufrufe

[ngClass]=... anstelle von *ngClass.

*" ist nur für die Shorthand-Syntax für strukturelle Direktiven, wo Sie zum Beispiel verwenden können

<div *ngFor="let item of items">{{item}}</div>

anstelle der längeren äquivalenten Version


  <div>{{item}}</div>

Siehe auch https://angular.io/docs/ts/latest/api/common/index/NgClass-directive.html

>     ...
>     ...
>     ...
>     ...
>     ...

Siehe auch https://angular.io/docs/ts/latest/guide/template-syntax.html

>     
>     <div [class.special]="isSpecial">The class binding is special</div>
>     
>     
>     <div class="special"
>          [class.special]="!isSpecial">This one is not so special</div>



> 
>     
>     <div class="bad curly special"
>          [class]="badCurly">Bad curly</div>
Günter Zöchbauer
Bearbeitete Antwort 28. März 2017 в 7:51
Kommentare (2)

Eine andere Lösung wäre die Verwendung von [class.active].

Beispiel:

<ol class="breadcrumb">
    <li [class.active]="step=='step1'" (click)="step='step1'">Step1</li>
</ol>
Kommentare (1)

Sie sollten etwas ([ngClass] anstelle von *ngClass) wie das verwenden:

<ol class="breadcrumb">
  <li [ngClass]="{active: step==='step1'}" (click)="step='step1; '">Step1</li>
  (...)
Kommentare (0)