У меня есть таблица соответствия, где я пытаюсь применить динамический фильтр, где таблица соответствия находится в родительском компоненте, а раскрывающийся список фильтра находится в дочернем компоненте ( app-filter-template ).
<ng-container matColumnDef="Name">
<th mat-header-cell *matHeaderCellDef (click)='onFilterClick("Name")'> Name
<app-filter-template [filterheader]="column"></app-filter-template>
</th>
<td mat-cell *matCellDef="let element"> {{element[Name]}} </td>
</ng-container>
<ng-container matColumnDef="LName"> ... </ng-container>
//8 more columns...
Parent.ts
onFilterClick(filter) {
this.column = filter;
}
Таким образом, при каждом нажатии th значение столбца изменяется, в результате чего filterheader * 1012 дочернего приложения-фильтра-шаблона * filterheader* свойство установлено.
FilterTemplateComponent.ts
@Input() set filterheader(column: string) {
console.log(column);
}
Проблема в том, что таблица матов имеет 10 столбцов, даже если я нажимаю на первый столбец, заголовок фильтравызывается 10 раз (как число в столбце).
Как ограничить значение, устанавливаемое только один раз, я тоже пробовал тему поведения, но опять та же проблема?.