Изменить выбранные мат-фишки в пределах / после выбора. Изменить

Question

Концепция заключается в том, что я хочу фильтровать отображаемую информацию на странице, на основе которой выбрано mat-chips.

HTML:

<mat-chip-list [multiple]="true">
    <mat-chip
       class="item-filter-mat-chip"
       *ngFor="let itemFilter of itemFilters"
       [selectable]="true"
       [selected]="itemFilter.selected"
       [value]="itemFilter"
       (selectionChange)="updateItemFilter($event)"
       (click)="chip.toggleSelected()"
       #chip="matChip">
       {{itemFilter.displayValue}}
  </mat-chip>
</mat-chip-list>

Элемент TypeScript:

export interface ItemFilter {
    itemType: ItemType[];
    displayValue: string;
    selected: boolean;
}

Однако я хочу один из mat-chips - это значение по умолчанию, которое выбирается, если не выбраны все остальные микросхемы. Однако кажется, что logi c для изменения выбора должен произойти в updateItemFilter, который затем создает ExpressionChangedAfterItHasBeenCheckedError. Это потому, что я пытаюсь изменить значения выбора внутри вызываемого метода selectionChange.

Ситуация такая. Фильтр по умолчанию выбран. После выбора другого фильтра фильтр по умолчанию должен быть отменен. Можно выбрать несколько других фильтров. Если выбран фильтр по умолчанию, все остальные фильтры должны быть отменены.

Answer 1

После закапывания исправление, по-видимому, больше не используется (selectionChange) на микросхеме и вместо этого изменяет выбор И обновляет фильтр внутри пользовательского метода (щелчка).

<mat-chip-list [multiple]="true">
    <mat-chip
        class="item-filter-mat-chip"
        *ngFor="let itemFilter of itemFilters"
        [selectable]="true"
        [selected]="itemFilter.selected"
        [value]="itemFilter"
        (click)="updateItemFilter(chip)"
        #chip="matChip">
        {{itemFilter.displayValue}}
    </mat-chip>
</mat-chip-list>