I want to add dynamically two classes to a button.
One class is a simple variable reference, and the other needs to use conditional logic.
Here is my code :
<button type="button" class="btn btn-circle btn-xl "
*ngFor="let node of warriorNodesList"
[ngClass]="node.name"
[ngClass]="{'btn-info':node.isLocked == true ,'btn-danger':node.isLocked == false}"
(mouseover)="display($event, node)">
<span>{{node.name}}</span>
</button>
name
node
*ngFor="let node of warriorNodesList"
[ngClass]="node.name
[ngClass]="{'btn-info':node.isLocked == true ,'btn-danger':node.isLocked == false}
ngClass
ngClass
This should do what you want:
[ngClass]="[ node.name, node.isLocked == true ? 'btn-info' : 'btn-danger' ]"