Angular mat select SELECTION更改获取组角度

我用两个

mat optgroup

组控制

mat select

它有一个事件处理程序

（selectionChange）=“applicationSelected（$event.value，i）

---

如何检测选项是从哪个组中选择的？

从

selectionChange

事件中没有一种简单、直接的方法来了解该组。它只告诉您选项的来源（MatSelect）和所选值。但是，MatOption的

onSelectionChange

事件允许您访问MatOption，而MatOption反过来又允许访问MatOptionGroup。例如：

<mat-option (onSelectionChange)="optionSelected($event)" ...>...</mat-option>

optionSelected(event: MatOptionSelectionChange) {
    console.log(event.source.group.label);
}

。。。
选择的选项（事件：MatOptions选择更改）{
日志（event.source.group.label）；
}

从

selectionChange

事件中没有一种简单、直接的方法来了解组。它只告诉您源（MatSelect）和所选值。但是，MatOption的

onSelectionChange

事件允许您访问MatOption，而MatOption反过来又允许您访问MatOption组。例如：

<mat-option (onSelectionChange)="optionSelected($event)" ...>...</mat-option>

optionSelected(event: MatOptionSelectionChange) {
    console.log(event.source.group.label);
}

。。。
选择的选项（事件：MatOptions选择更改）{
日志（event.source.group.label）；
}

我也遇到了这个问题，但请记住，onSelectionChanged（）的预期行为如下所示：选择更改事件不仅在选择某个选项时触发，而且在取消选择该选项时也会触发。因此，当选择某个选项时，会触发两个事件：用户选择和现在取消选择的选项。 同样，您将看到触发了2个事件。第一个事件是所需的事件。您可以查看event.isUserInput是否设置为true（所需事件），并将group.name发送到事件处理程序：

在组件html中：

{{category.viewValue}}

我也遇到了这个问题，但请记住，onSelectionChanged（）的预期行为如下所示：选择更改事件不仅在选择某个选项时触发，而且在取消选择该选项时也会触发。因此，当选择某个选项时，会触发两个事件：用户选择和现在取消选择的选项。 同样，您将看到触发了2个事件。第一个事件是所需的事件。您可以查看event.isUserInput是否设置为true（所需事件），并将group.name发送到事件处理程序：

在组件html中：

{{category.viewValue}}

我还认为mat功能不提供对组值的轻松访问有点可笑，因为组的所有想法都是将选择的选项分离到一些组中，在许多情况下，用例是在逻辑级别用选择的选项包装组数据

这就是我的解决方案：

<mat-form-field >
  <mat-label>Filter By</mat-label>
  <mat-select  panelClass="" #choosedValue (valueChange)="doSomething1(choosedValue.value)" >
    <mat-option >-- None --</mat-option>
    <mat-optgroup  #group1 *ngFor="let group of filterData" [label]="group.viewValue"
                   style = "background-color: #0c5460">
      <mat-option #mmm *ngFor="let option of group.options" [value]="{value: option.value, groupValue: group.value}" >
        {{option.viewValue}}
      </mat-option>
    </mat-optgroup>
  </mat-select>
</mat-form-field>

---

我还认为mat功能不提供对组值的轻松访问有点可笑，因为组的所有想法都是将select选项分离到一些组中，在许多情况下，用例是在逻辑级别用所选的选项包装组数据

这就是我的解决方案：

<mat-form-field >
  <mat-label>Filter By</mat-label>
  <mat-select  panelClass="" #choosedValue (valueChange)="doSomething1(choosedValue.value)" >
    <mat-option >-- None --</mat-option>
    <mat-optgroup  #group1 *ngFor="let group of filterData" [label]="group.viewValue"
                   style = "background-color: #0c5460">
      <mat-option #mmm *ngFor="let option of group.options" [value]="{value: option.value, groupValue: group.value}" >
        {{option.viewValue}}
      </mat-option>
    </mat-optgroup>
  </mat-select>
</mat-form-field>

---

我的项目中没有使用角度材质，但我猜您可以使用$event捕捉选定的组？@Enima，谢谢。我也这么认为，但在$event对象中没有找到任何有用的字段。我的项目中没有使用角度材质，但我猜您可以使用$event捕捉选定的组？@Enima，谢谢。我也这么认为未在$event对象中找到任何有用的字段。