手动设置FormBuilder控件的值

16 浏览
0 Comments

手动设置FormBuilder控件的值

这件事已经让我抓狂了，我已经没有时间再花一整天在这上面。

我正在尝试在组件中手动设置控件值（\'dept\'），但它就是不起作用 - 即使新值已正确记录到控制台中。

这是FormBuilder实例：

initForm() {
  this.form = this.fb.group({
    'name': ['', Validators.required],
    'dept': ['', Validators.required],
    'description': ['', Validators.required],
  });
}

这是接收所选部门的事件处理程序：

deptSelected(selected: { id: string; text: string }) {
  console.log(selected) // Shows proper selection!
  // This is how I am trying to set the value
  this.form.controls['dept'].value = selected.id;
}

现在，当表单提交时，如果我记录this.form，该字段仍为空白！我已经看到其他人使用updateValue()但这是beta.1版本，我不认为这是在控件上调用的有效方法。

我也尝试过调用updateValueAndValidity()但没有成功 :(。

我只需在表单元素上使用ngControl=\"dept\"，就像我对表单的其余部分所做的那样，但它是自定义指令/组件。

  [placeholder]="'No Dept Selected'">

admin 更改状态以发布 2023年5月20日
0

2 答案

0 Comments

在Angular 2最终版本(RC5+)中，有新的API可用于更新表单值。 patchValue() API方法支持部分表单更新，我们只需指定一些字段即可： 

this.form.patchValue({id: selected.id})

同时，还有一个setValue() API方法需要一个包含所有表单字段的对象。如果有一个字段缺失，我们将会收到一个错误。

0
0 Comments

更新日期：2017年3月19日

this.form.controls['dept'].setValue(selected.id);

旧版：

目前我们只能进行一种类型转换：

(this.form.controls['dept']).updateValue(selected.id)

我同意这不是很优雅。希望未来版本中能改进这点。

0