在Angular中,表单的初始值可以通过使用Reactive Forms或Template-driven Forms来设置。以下是两种方法的示例代码:
在组件类中,使用FormBuilder
和FormGroup
来创建一个表单,然后使用patchValue
方法来设置初始值。
import { Component, OnInit } from '@angular/core';
import { FormBuilder, FormGroup } from '@angular/forms';
@Component({
selector: 'app-my-form',
template: `
`
})
export class MyFormComponent implements OnInit {
myForm: FormGroup;
constructor(private fb: FormBuilder) {}
ngOnInit() {
this.myForm = this.fb.group({
name: ['Initial Value']
});
}
}
使用ngModel
指令来绑定表单字段,并通过给字段添加ngModel
指令来设置初始值。
在组件类中,设置name
属性的初始值。
import { Component } from '@angular/core';
@Component({
selector: 'app-my-form',
template: `
`
})
export class MyFormComponent {
name = 'Initial Value';
}
通过以上两种方式,您可以在Angular中设置表单的初始值。
上一篇:Angular表单不发送更新的值