Add Condition to the table in angular

 Add condtion to tr  in  ANgular

<h1>Method 1: With [ngClass]</h1>

<table border="1">

  <thead>

    <td>Reading Time</td>

    <td>PH</td>

  </thead>

  <tbody>

    <tr *ngFor='let element of ph'

      [ngClass]="{'color': (element.ph > 20 && element.ph < 50)}">

      <td>{{element.timestamp}}</td>

      <td>{{element.ph}}</td>

    </tr>

  </tbody>

</table>

<br>

<hr>

<h1>Method 2: With [class.color]</h1>

<table border="1">

  <thead>

    <td>Reading Time</td>

    <td>PH</td>

  </thead>

  <tbody>

    <tr *ngFor='let element of ph'

      [class.color]='element.ph > 20 && element.ph < 50'>

      <td>{{element.timestamp}}</td>

      <td>{{element.ph}}</td>

    </tr>

  </tbody>

</table>