angular css class conditional code example

Example 1: conditional style angular

<div [ngStyle]="{'color':employee.country === 'India' ? 'orange' : 'red' }"></<div>

Example 2: if condition in class angular 8

<i [class]="user.login_status == 1 ? 'fas fa-circle user_active' : 'fas fa-circle user_inactive'" aria-hidden="true"></i>

Example 3: ngclass multiple conditions

<a [ngClass]="{'class1':array.status === 'active','class2':array.status === 'idle','class3':array.status === 'inactive',}">

Example 4: conditionally assign a css class angular 9

<div [ngClass]="{'message': info.priority < 10,
                 'warn': info.priority > 10 && info.priority < 20, 
                 'error': info.priority > 30}">

{{info.text}}

</div>

Example 5: conditional classes angular

<div 
  [className]="isActive ? 'active' : 'inactive'">
</div>