web-dev-qa-db-ja.com

Angular Mat Select Multiple selectionchange変更されたオプションの検出

multipleオプションが設定された<mat select>があります（複数選択）。 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>に配置しようとしましたが、サポートされていないようです。

angularangular-materialmulti-select
13
Curtis

<mat-option>でonSelectionChangeを使用する必要がありましたが、これは<mat-select>で使用できるselectionChangeとは異なります

それがmat-selectのドキュメントに含まれていればいいでしょう。

ここでは動作しています https://stackblitz.com/edit/angular-1e9gsd-34hrwg?file=app/select-overview-example.html

25
Curtis