Angular: clase condicional con *ngClass

¿Qué pasa con mi código Angular? Estoy recibiendo:

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
Pregunta editada 13º noviembre 2018 в 7:37
Programación
javascript css angular angular-template angular-ng-class
8º febrero 2016 в 12:00
15 vistas

[ngClass]=... en lugar de *ngClass.

El símbolo * es sólo para la sintaxis abreviada de las directivas estructurales en las que se puede utilizar, por ejemplo

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

en lugar de la versión equivalente más larga


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

Véase también https://angular.io/docs/ts/latest/api/common/index/NgClass-directive.html

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

Véase también 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
Respuesta editada 28º marzo 2017 в 7:51
Comentarios (2)

Otra solución sería utilizar [class.active].

Ejemplo :

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

Deberías usar algo ([ngClass] en lugar de *ngClass) así:

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

..;

Comentarios (0)