Я работаю с компонентом таблицы, в котором строки можно пометить / пометить как избранные, щелкнув значок звездочки в выделенном столбце:
<table mat-table [dataSource]="dataSource" matSort multiTemplateDataRows cellpadding="10">
...
<ng-container *ngIf="col.name === 'fav'" matColumnDef="fav">
<th mat-header-cell *matHeaderCellDef></th>
<td mat-cell *matCellDef="let row">
<button mat-icon-button *ngIf="!isFaved(row)" (click)="favRow(row)"><mat-icon>star_border</mat-icon></button>
<button mat-icon-button *ngIf="isFaved(row)" (click)="unfavRow(row, false)"><mat-icon>star</mat-icon></button>
</td>
</ng-container>
...
</table>
Это прекрасно работает: при нажатии на значокстрока отмечена как избранная, isFaved (строка) возвращает значение true, и значок соответствующим образом обновляется.
То же самое работает наоборот: при нажатии на значок для строки избранного,строка не помечена как избранная, isFaved (row) возвращает значение false, а значок обновляется.
У меня также есть дополнительный вариант использования, в котором состояние избранной строки можетбыть измененным родительским компонентом.
Это также работает частично: таблица получает информацию о том, какую строку удалять, и сведения в компоненте таблицы корректно обновляются, поэтому isFaved (row) вернул бы правильную информацию.
К сожалению, ничего не вызывает эту функцию, так как не было щелчка по значку fav, поэтому значок неправильно оставленв привилегированном состоянии, пока я не обновлю страницу вручную.
Как мне справиться с этим делом?Есть ли что-то более элегантное, чем провоцирование фиктивного клика?