Угловой мат Выберите несколько вариантов выбора, в которых была изменена опция

У меня есть <mat select> с установленной опцией multiple (множественный выбор). Когда срабатывает событие selectionChange, мне нужно знать, какая опция была отмечена или не отмечена, однако она возвращает только новый текущий список выбранных опций.

Например, у меня есть список:

<mat-select (selectionChange)="change($event)" multiple placeholder="Select">
  <mat-option value="1">one</mat-option>
  <mat-option value="2">two</mat-option>
  <mat-option value="3">three</mat-option>
  <mat-option value="4">four</mat-option>
</mat-select>

Если опции one, three и four проверены, а затем опция пользователя не отмечена four, в обработчике событий мне нужно знать, какая опция вызвала событие (т.е. опция four) и его новое состояние. В настоящее время я не вижу способа получить доступ к этой информации в событии selectionChange.

https://stackblitz.com/edit/angular-1e9gsd?file=app/select-overview-example.ts

Я попытался поместить обработчик событий (selectionChange)="change($event)" на <mat-option>, но он не поддерживается.

Ответ 1

Мне нужно было использовать onSelectionChange для <mat-option>, который отличается от selectionChange который вы можете использовать в <mat-select>

Было бы хорошо, если бы это было в документации для mat-select.

Здесь работает https://stackblitz.com/edit/angular-1e9gsd-34hrwg?file=app/select-overview-example.html.

Ответ 2

Это сработало для меня. blahs - это массив строк в этом случае. Используйте двухстороннее связывание:

<mat-select placeholder="choose..." [(value)]="selected" 
      (selectionChange)="somethingChanged(selected)">
  <mat-option *ngFor="let b of blahs; index as i;" value={{b[i]}}">{{b[i]}}
  </mat-option>
</mat-select>