Angular ngClass

Multiple classes:


<div class="user--status"

      [ngClass]="{

        'user--status-active': user?.status === 'active',

        'user--status-inactive': user?.status === 'inactive'

      }">

      {{ user?.status }}

</div>

Conditional class:


<div class="user--status"

      [ngClass]="user?.status == 'active' ? 'user--status-active' : 'user--status-inactive'">

      {{ user?.status }}

</div>

Leave a Comment