Angular ngClass not working

Question

I'm new to Angular and I'm trying to get ngClass to work but it doesn't want to. Here is my code:

<div *ngFor= "let job of dashboardJobsDetails" class="card">
    <div  ngClass="{'red card':job.status == 'Failed', 'yellow card': 
          job.status =='Warning', 'green card': job.status =='Success'}">
        Status: {{job.status}}
    </div>
</div>

The ngFor works great, the second div shows the correct status, but the ngClass never applies the style. Any ideas or tips?

Answer 1

The syntax is wrong, it should be

<div  [ngClass]="{'red card':job.status == 'Failed', 'yellow card': 
      job.status =='Warning', 'green card': job.status =='Success'}">