Angular change color of a cell with condition-CodePudding

I have a table and I should change the background color in some conditions:

<tbody >
                  <tr *ngFor="let offer of offers" 
                    [ngStyle]="{'background-color': offer.status && offer.status=== 'error' ? red : null}"> // I have tried like this but doesn't works
                    
                    <td >{{offer.date | date:'dd/MM/yyy'}}</td>
                    <td > {{offer.customer}} </td>
                    <td > {{offer.code}} </td>
                    <td >{{offer.catalog ? offer.catalog : ''}}</td>
                    </td>
                  </tr>
                </tbody>

my offer status can be: error, ok, waiting.

How can I change the background of the row with the status.offer??

CodePudding user response：

You have an undefined variable red in your template. If you want to use the CSS value "red", you need to use quotes:

[ngStyle]="{'background-color': offer.status && offer.status === 'error' ? 'red' : null}"