Angular 将值加载到mat select组件

我在mat select组件（角材质）中有一个双向绑定问题。 在ts文件中，我有一个选项列表和绑定变量（valueFromDB）。 然后我在mat select component中选择值，它将值复制到valueFromDB变量。另一方面，在sceen加载时，我希望看到在mat中选择component valueFromDB变量。我怎么做

导出类SelectValueBindingExample{
valueFromDB=新选项（“选项2”）；
选项=[新选项（'Option1'）、新选项（'Option2'）、新选项（'Option3'）]；
}
导出类选项{
名称：字符串；
构造函数（n:string）{
this.name=n；
}
}
没有一个
{{option.name}

您的

valueFromDB

没有对数组中对象的引用，因此Angular无法绑定它们。我看到两个选项，通过在数组中查找匹配值来创建引用，如：

ngOnInit() {
  this.valueFromDB = this.options.find(x => x.name === this.valueFromDB.name)
}

或者使用

与
进行比较：

compareFn(op1: Option, op2: Option) {
  return op1.name === op2.name;
}

在模板中：

<mat-select [(ngModel)]="valueFromDB" [compareWith]="compareFn">



您的StackBlitz与
比较与
：（创建对象引用也被添加，但被注释掉）

<mat-select [(ngModel)]="valueFromDB" [compareWith]="compareFn">