Angular Material md-select 预填充时不显示值

Question

我有一个嵌套表格，一个组中的一个组：

this.formBuilder.group({
        ...
        placeFirst: this.formBuilder.group({valy: ['', Validators.required]}),
        ...
    })

当我想使用预填充数据更新表单时：

this.listingForm.get('placeFirst.valy').setValue(listing.placeFirst);

表单已预填充，因为我可以看到字段中填充了 json 管道，但 md-select 未显示标题。 HTML 是：

<div formGroupName="placeFirst">
  <md-select placeholder="Place" formControlName="valy" (change)="creator.placeFirstSelected($event.value)">
    <md-option *ngFor="let placeFirst of creator.placesFirst" [value]="placeFirst">
      {{placeFirst.title}}
    </md-option>
  </md-select>
</div>

如果我使用 'select' 和 'option' 而不是 'md-select' 和 'md-option'，我可以看到当前所选选项的标题。

Answer 1

正如@developer033 在评论中所说，问题是标记为选中的对象与列表中的对象不相等。由于问题仍未解决 (github)，我现在的解决方法是使用以下键过滤列表：

    const placeFirst = this.placesFirst.filter(el => el.key === placeFirstKey)[0];
    this.listingForm.get('placeFirst.valy').setValue(placeFirst);

Angular Material md-select 预填充时不显示值

Angular Material md-select don't show value on prepopulate

angular

angular-material2

angular4-forms