Angular mat-select 获取选中的选项数据对象答案

【问题标题】：Angular mat-select get the selected option data objectAngular mat-select 获取选中的选项数据对象
【发布时间】：2019-08-07 02:11:49
【问题描述】：

在我的 Angular 7 应用下，我正在使用 mat-select 组件：

<mat-form-field  class="col-md-3" color="warn">
     <mat-select placeholder="Selectionner le code Edo"
                  id="codeEdo"
                  [(value)]="selectedCodeEdoValue"
                  ngDefaultControl
                  formControlName="codeEdo">
     <mat-option (onSelectionChange)="onEdoSelectionChanged(edo )"
                 *ngFor="let edo of shopsList"
                  [value]="edo.edoId">
                  {{edo.edoId}}
     </mat-option>
     </mat-select>
</mat-form-field>

我的选项数据如下：

let shopsList= [
  {
    'edoId': '4010',
    'storeName': 'ABBEVILLE'
  }
  ,
  {
    'edoId': '3650',
    'storeName': 'AGEN'
  }
  ,
  {
    'edoId': '3298',
    'storeName': 'AIX ALLEES PROVENCALES'
  }
];

我的目的是在选择选项时获取选定对象数据，而不仅仅是值

例如，当我选择第一个选项时，我想得到这个：

result = {
    'edoId': '4010',
    'storeName': 'ABBEVILLE'
}

不仅是值'4010'

如您所见，我已经尝试过：(onSelectionChange)="onEdoSelectionChanged(edo )

但这总是让我感到两个事件，对于旧选择的选项和新选择的选项，

我如何才能获得新的选择数据？？

【问题讨论】：

标签： javascript angular angular-material angular6 angular-material2

【解决方案1】：

我认为你的错误在于这段代码：

[value]="edo.edoId"

试试改成

[值]="edo"

这将返回完整的对象，而不仅仅是那个特定的字段

【讨论】：

没错，但我的问题是这个方法“onSelectionChange”总是会触发我两个响应事件：旧的选项数据和新的，我只想要第二个新的
你应该使用 'selection change' 而不是 'onSelectionChange' (selectionChange)="method($event)">