Angular 4 - 无法设置下拉列表的默认值

Question

我在Angular 4中创建了一个Reactive表单。它有一个下拉字段，其值通过Web服务调用获取。

除了Web服务返回的值之外，我还希望在下拉列表中显示另一个选项，其中包含一些标签，例如“请选择一个值”并默认选中此选项。

我的模板看起来像

<div class="col-xs-6">
            <div class="form-group">
              <label for="property" class="col-xs-4">Description</label>
              <div class="col-xs-8">
                <select id="property" formControlName="property" class="form-control input-sm">
                    <option *ngFor="let property of properties" [ngValue]="property">{{ property }}</option>
                    <option [ngValue]="'No Selection'" [selected]="selected">Please select a value </option>
                 </select>
              </div>
            </div>
          </div>

然后在组件中

this.myService.get("prop")
  .subscribe(
  (response: Response) => {
    let items: any[] = JSON.parse(response.text());
    for (let item of items) {
      let property = item.val;
      this.properties.push(property);
      this.myForm.setControl('property', new FormControl(property));
    }
  }

  )

这将使用从服务返回的所有值填充下拉列表，并附加一个值“请选择一个值”。

但是，默认情况下不会选择附加值。实际上，从服务器返回的所有值中，默认情况下会选择最后一个值。

我尝试过像'selected'这样的标准HTML选项。似乎默认情况下选择了“No Selection”，但随后服务器的值会越过，因此默认值会更改为服务器返回的值之一。