Angular Material Select下拉列表，发射整个对象项，而不仅仅是一个值

Question

Angular Material select下拉API仅发出一个值。 [(ngModel)]和(selectionChange)都只发出单个成员，而不发出整个对象数据字段。

例如，例如，它仅发出food.value = 2，不为行列表项发出其他类字段，例如foodName，foodDescription，foodWeight等（需要为listId发出所有相应的成员）] >

在给定food.value的情况下，如何发出整个食物对象？

https://material.angular.io/components/select/api

<mat-form-field>
  <mat-label>Favorite food</mat-label>
  <mat-select>
    <mat-option *ngFor="let food of foods" [value]="food.value">
      {{food.viewValue}}
    </mat-option>
  </mat-select>
</mat-form-field>
类别示例，对于2，需要foodCategory，卡路里和其他字段，等等

export class SelectOverviewExample {
  foods: Food[] = [
    {value: '0', viewValue: 'Steak', foodCategory: 'Meat', Calories: 50},
    {value: '1', viewValue: 'Pizza', foodCategory: 'Carbs', Calories: 100},
    {value: '2', viewValue: 'Apple', foodCategory: 'Fruit', Calories: 25}
  ];
}
任何人都有更好的解决方案吗？

否则，将其写入selectionChange onOutput方法中。似乎Angular Materials会有更好的选择，

this.foods.find(x=>x.value =="2")

Angular Material select下拉API仅发出一个值。 [（ngModel）]和（selectionChange）都只发出单个成员，而不是整个对象数据字段。例如，它仅发出food.value ...

Answer 1

<mat-form-field>
  <mat-label>Favorite food</mat-label>
  <mat-select>
    <mat-option *ngFor="let food of foods; let i = index" [value]="i" (onSelectionChange)="onValueChange(food)">
      {{food.viewValue}}
    </mat-option>
  </mat-select>
</mat-form-field>

Answer 2

Answer 3

尝试这个