Concat classname with variable Angular 2

angular angular2-template classname
Dipak Telangre picture Dipak Telangre · Feb 28, 2018 · Viewed 9.9k times · Source

I want something like class = "myClass {{classVar}}"

I am trying to concat class name with variable value in scope but not working. 

<div *ngFor="let classVar of classList" >
  <span [ngClass]="'myClass' classVar "></span>                
</div>

Answer

Chrillewoodz picture Chrillewoodz · Feb 28, 2018

Add a + and a space:

<div *ngFor="let classVar of classList" >
  <span [ngClass]="'myClass ' + classVar"></span>                
</div>

Related questions

Angular HTML binding

I am writing an Angular application and I have an HTML response I want to display. How do I do that? If I simply use the binding syntax {{myVal}} it encodes all HTML characters (of course). I need somehow to …

Read More
OrderBy pipe issue

I'm not able to translate this code from Angualr 1 to Angular 2: ng-repeat="todo in todos | orderBy: 'completed'" This is what i've done following the Thierry Templier's answer: Component template: *ngFor="#todo of todos | sort" Component code: @Component({ selector: 'my-app', templateUrl: "./…

Read More
Angular2 disable button

I know that in angular2 I can disable a button with the [disable] attribute, for example: <button [disabled]="!isValid" (click)="onConfirm()">Confirm</button> but can I do it using [ngClass] or [ngStyle] ? Like so: <button […

Read More