该问题出现的原因可能是FormGroup未正确绑定数据,或者使用了不可变数据。要解决此问题,我们可以尝试使用FormGroup的patchValue方法,而不是setValue方法。
示例代码:
HTML:
Component: import { Component, OnInit } from '@angular/core'; import { FormGroup, FormBuilder } from '@angular/forms';
@Component({ selector: 'app-my-component', templateUrl: './my-component.component.html', styleUrls: ['./my-component.component.scss'] }) export class MyComponent implements OnInit {
myForm: FormGroup;
constructor(private fb: FormBuilder) { }
ngOnInit(): void { this.myForm = this.fb.group({ myField: '' });
this.myForm.patchValue({
myField: 'initial value'
});
}
updateValue() { this.myForm.patchValue({ myField: 'new value' }); } }
在上面的示例中,我们首先使用FormGroup和FormBuilder创建一个表单,然后在组件的ngOnInit方法中使用patchValue方法将初始值绑定到表单字段上。在updateValue方法中,我们可以使用相同的方法将新的值绑定到字段上,而不是使用setValue方法。这样做将确保表单字段能够正确地更新。