在Angular 6中,当使用patchValue
方法更新表单控件的值时,表单控件的值确实会被更新,但是这些更新的值不会立即提交到表单模型中。如果想要在提交表单时也更新表单模型的值,可以使用updateValueAndValidity
方法。以下是一个代码示例:
首先,在组件中创建一个表单模型和一个表单控件:
import { Component } from '@angular/core';
import { FormBuilder, FormGroup } from '@angular/forms';
@Component({
selector: 'app-example',
template: `
`
})
export class ExampleComponent {
myForm: FormGroup;
constructor(private formBuilder: FormBuilder) {
this.myForm = this.formBuilder.group({
myControl: ['']
});
}
onSubmit() {
console.log(this.myForm.value); // 输出原始值
this.myForm.patchValue({
myControl: 'Updated value'
});
console.log(this.myForm.value); // 输出更新后的值
// 更新表单模型的值
this.myForm.controls['myControl'].updateValueAndValidity();
console.log(this.myForm.value); // 输出更新后的值
}
}
在上面的代码中,patchValue
方法用于更新myForm
表单控件中的myControl
值。在onSubmit
方法中,updateValueAndValidity
方法用于更新表单模型的值,并使其有效。这样,在提交表单时,表单模型中的值就会被正确更新。
请注意,updateValueAndValidity
方法的调用是可选的,如果希望在提交表单时更新表单模型的值,才需要使用它。