Angular Mat-select获取选定的选项数据对象

时间:2019-03-15 23:53:01

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

在我的 Angular 7 应用中,我使用的是垫选择组件:

<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'
  }
];

我的目的是在选择一个选项时获取所选对象数据,而不仅仅是获取值

例如,当我选择 first选项时,我想得到这个:

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

不仅值'4010'

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

但这总是激发我两个事件,分别是旧选择的选项和新选择的选项

我怎么只获得新的选择数据?

1 个答案:

答案 0 :(得分:3)

我认为您的错误与以下代码有关:

  

[value] =“ edo.edoId”

尝试将其更改为

  

[value] =“ edo”

这将返回完整的对象,而不仅仅是该特定字段