Angular Material md-select不会在预填充上显示值

时间:2017-07-09 08:57:07

标签: angular angular-material2 angular4-forms

我有一个嵌套表单,一个组内的组:

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',我可以看到当前选项的标题已被选中。

1 个答案:

答案 0 :(得分:0)

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

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