angular7 - 如何在Angular 7中动态绑定下拉值

Question

我有一个下拉列表，这个下拉列表的值应该是动态绑定的。

<mat-select formControlName="approver">
              <mat-option *ngFor="let action of approver; let i = index" [value]="approver[i].value">
                {{approver[i].viewValue}}
              </mat-option>
            </mat-select>

我有一个网格，选择的行列值应该是下拉列表的值。

getApprover() {
      console.log('123');
      this.selectedRowData = this.data.Dialog_rowData;

      for (let i = 0; i < this.selectedRowData.length; i++) {

        this.approver[i] = [
           { value: this.selectedRowData[i].approverList.login0,
                viewValue: this.selectedRowData[i].approverList.name0 }
        ];
      }
      console.log(this.approver);
      return this.approver;
    }

export interface ExApprover {
  value: string;
  viewValue: string;
}

 approver: ExApprover[] = [
    {value: 'Brasile, Theresa', viewValue: 'Brasile, Theresa'},   ];


constructor(private formBuilder: FormBuilder) {

                this.form = this.formBuilder.group({
                  approver: [ { value: '', viewValue: ''}]
                });

                of(this.getApprover()).subscribe(approver => {
                  this.approver = approver;
                });
               }

    ngOnInit() {
    }

我收到类似“找不到带有名称的控件：”用户输入“和未加载值的错误。