У меня есть динамическая таблица матов, чтобы показать ответ json, который я получаю от rest api. Я хочу изменить цвет ячейки в зависимости от некоторого условия. Но если я попытаюсь применить [ngStyle], он применяется ко всей строке. Я хочу применить его только к определенной ячейке,
<mat-table #table [dataSource]="dataSource">
<ng-container *ngFor="let column of columns" [cdkColumnDef]="column.columnDef">
<mat-header-cell *cdkHeaderCellDef>{{ column.header }}</mat-header-cell>
<mat-cell *cdkCellDef="let data" [ngStyle]="{'color': data.name == 'Boron' ? 'green':'red'}">{{ column.cell(data) }}</mat-cell>
</ng-container>
<mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>
<mat-row *matRowDef="let row; columns: displayedColumns;"></mat-row>
</mat-table>
Структура JSON:
[
{
"col1": {"name":"Boron","grade":A15},
"col2": [A15],
},
{
"col1": {"name":"Hydrogen", "grade":A28},
"col2": ["Hydrogen"],
},
{
"col1": {"name":"Helium", "grade":A56},
"col2": ["Helium","A56"],
},
]
В приведенной выше структуре столбец 1 предназначен для отображения значений в таблице, а столбец 2 - это значение для изменения цветового кода конкретной строки.
Будем признательны за любую помощь !!!!