使用 FormBuilder 从 Angular 2 中的异步调用设置默认表单对象值答案

【问题标题】：Setting default form object value from async call in Angular 2 using FormBuilder使用 FormBuilder 从 Angular 2 中的异步调用设置默认表单对象值
【发布时间】：2016-11-17 04:06:00
【问题描述】：

我正在使用"@angular/forms": "~2.1.0" 和"angular-cli": "1.0.0-beta.19-3" 并尝试设置我的FormGroup (campaignForm) campaign_config_id 属性的默认值，之后我进行了异步调用以获取列表campaignConfigs.

我已经尝试按照另一个 SO 建议使用以下内容，但我得到了 TypeError: _this.campaignForm.controls.campaign_config_id.updateValue is not a function。

this.campaignConfigService.getCampaignConfigs()
  .subscribe(
    campaignConfigs => {
      ...
      this.campaignForm.controls['campaign_config_id'].updateValue(campaignConfigs[0].id)
    }
  );

我也尝试将this.campaignForm.controls['campaign_config_id'] 转换为NgControl、FormControl、SelectControlValueAccessor 和其他对象，但它们都没有.updateValue 函数。

关于如何最好地做到这一点的任何建议？

【问题讨论】：

标签： angular angular2-formbuilder

【解决方案1】：

我认为处理表单最灵活的方法是使用“ReactiveForms”并使用 FormBuilder 类创建表单。

请研究一下响应式表单和 FormGroup/FormBuilder，最后你可以这样做：this.form.controls['campaign_config_id'].setValue(yourIdValue)

【讨论】：

【解决方案2】：

updateValue() 已弃用。使用setValue() 代替所有类型的表单控件。

【讨论】：