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

Question

У меня есть <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>, но этоне поддерживается.

Answer 1

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

<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>

Answer 2

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

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

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