Angular 材料多 select 获取隐藏的选定值

Question

设想：

• 我在 angular 材质多选中有一个过滤器

去做：

• 我想在隐藏的下拉列表中获取选定的值..

  我用谷歌搜索并试图找到文档，但找不到任何参考来将隐藏事件添加到 miltiselect

Answer 1

在关闭mat-select下拉列表后可以使用多选值的演示

应用代码： https ： //stackblitz.com/edit/angular-values-access-after-dropdown-close？file = src / app / app.component.html

方法：

• 保留变量以存储multi-select值。
  使用openedChange事件作为(openedChange)="comboChange($event)" ，并在该存储中将选定的值存储到数组或不同的变量中。
  如果下拉列表已关闭，则事件值为false ，因此我在演示代码中使用了它。
• 此外， mat-select与[formControl]="toppings" ，因此在任何其他方法中，您可以使用this.toppings.value访问其值，它将返回一个包含所选值的数组。

Answer 2

添加如下 Formcontrol 变量，我们可以从 angular 多选下拉列表中枚举所选项目

 <mat-select multiple placeholder="Reason" [formControl]="selectedReasons">
        <mat-option value="option1">option1</mat-option>
        <mat-option value="option2">option2</mat-option>
        <mat-option value="option3">option3</mat-option>
        <mat-option value="option4">option4</mat-option>
      </mat-select>

TS

 selectedReasons = new FormControl();

  reasonDropdownChangeEvent(event: any) {
console.log(this.selectedReasons.value.toString());

}