title: How to highlight angular-material table row conditionally?
body: <p>I just started with a basic approach so I want to highlight row color conditionally its not throwing any error but does not apply the background-color to the row. I have 5 rows that have <code>riskINdex</code> <code>H</code> , Any idea what is implemented wrong in below code?</p>
  
  <p>app.component.html</p>
  
  <pre><code>&lt;div&gt;
   &lt;mat-table&gt;
    &lt;ng-container matColumnDef="eventType"&gt;
          &lt;mat-header-cell *matHeaderCellDef&gt; Event Type &lt;/mat-header-cell&gt;
          &lt;mat-cell *matCellDef="let element"&gt; {{element.eventType}} &lt;/mat-cell&gt;
        &lt;/ng-container&gt;
        &lt;mat-header-row *matHeaderRowDef="displayedColumns"&gt;&lt;/mat-header-row&gt;
        &lt;mat-row *matRowDef="let row; columns: displayedColumns;" (click)="selectedRow(row)" [ngClass]="{ 'high': row.riskIndex === 'High'}"&gt;&lt;/mat-row&gt;
      &lt;/mat-table&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>component.css</p>
  
  <pre><code>.high {
    background-color: red;
  }
  </code></pre>