在Angular中,如果要为模板形式的表单设置值,可以使用setValue()函数。但是,当我们尝试为表单设置值时可能会遇到一些问题。以下是如何使用setValue()函数来设置模板形式的表单值的示例代码。
首先在组件类中创建一个表单控件:
import { Component } from '@angular/core';
import { FormControl, FormGroup } from '@angular/forms';
@Component({
selector: 'app-root',
template: `
`
})
export class AppComponent {
myForm: FormGroup;
constructor() {
this.myForm = new FormGroup({
name: new FormControl('')
});
}
setValue() {
this.myForm.controls['name'].setValue('John');
}
}
在上面的代码中,我们创建了一个名为myForm的表单,并为其添加了一个FormControl控件。然后,我们使用setValue()函数将控件的值设置为“John”。
当我们点击“Set Value”按钮时,控制台将输出当前表单的值:
setValue() {
this.myForm.controls['name'].setValue('John');
console.log(this.myForm.value); // {name: "John"}
}
通过以上方法,我们成功地为模板形式的表单设置了值。