I have the following div on my angular project:
<div *ngIf="isPreviewExpanded" class="project-daypart-group-columns-container-expanded pull-left">
Where I have two options: isPreviewExpanded can be true or false
if it's true I want to show it as it right now but if it's false I need to show like this:
<div *ngIf="!isPreviewExpanded" class="project-daypart-group-columns-container-collapsed pull-left">
The class changes within the value of isPreviewExpanded
I'm not being able to find any way to do that in the same div, something like:
<div *ngIf="isPreviewExpanded" class="project-daypart-group-columns-container-expanded; else class='project-daypart-group-columns-container-collapsed'>
Any ideas?
Use ngClass directive that adds and removes CSS classes on an HTML element.
<div class="pull-left" [ngClass]="'project-daypart-group-columns-container-expanded':isPreviewExpanded, 'project-daypart-group-columns-container-collapsed': !isPreviewExpanded>