当使用setValue
方法更新Angular表单控件的值时,该值会被视为不可更改,因为setValue
方法会立即覆盖控件的当前值。
要解决这个问题,可以使用patchValue
方法来更新表单控件的值。patchValue
方法会在保留表单的当前值的基础上,更新给定的值。
以下是一个示例代码,展示如何使用patchValue
方法来更新Angular表单控件的值:
import { Component, OnInit } from '@angular/core';
import { FormGroup, FormBuilder } from '@angular/forms';
@Component({
selector: 'app-example',
template: `
`
})
export class ExampleComponent implements OnInit {
myForm: FormGroup;
constructor(private formBuilder: FormBuilder) { }
ngOnInit() {
this.myForm = this.formBuilder.group({
myControl: ['']
});
}
updateValue() {
this.myForm.patchValue({
myControl: 'New Value'
});
}
}
在上面的示例中,我们使用patchValue
方法来更新myControl
表单控件的值。每次点击"Update Value"按钮时,myControl
的值都会更新为"New Value"。