Angular: conditional class with *ngClass -
what wrong angular code? getting:cannot read property 'remove' of undefined @ browserdomadapter.removeclass ...
<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>
[ngclass]=...
instead of *ngclass
.
*
shorthand syntax structural directives can example use
<div *ngfor="let item of items">{{item}}</div>
instead of longer equivalent version
<template ngfor let-item [ngforof]="items"> <div>{{item}}</div> </template>
see https://angular.io/docs/ts/latest/api/common/index/ngclass-directive.html
<some-element [ngclass]="'first second'">...</some-element> <some-element [ngclass]="['first', 'second']">...</some-element> <some-element [ngclass]="{'first': true, 'second': true, 'third': false}">...</some-element> <some-element [ngclass]="stringexp|arrayexp|objexp">...</some-element> <some-element [ngclass]="{'class1 class2 class3' : true}">...</some-element>
see https://angular.io/docs/ts/latest/guide/template-syntax.html
<!-- toggle "special" class on/off property --> <div [class.special]="isspecial">the class binding special</div> <!-- binding `class.special` trumps class attribute --> <div class="special" [class.special]="!isspecial">this 1 not special</div>
<!-- reset/override class names binding --> <div class="bad curly special" [class]="badcurly">bad curly</div>
Comments
Post a Comment