我们需要在组件模块中导入 ReactiveFormsModule 模块并且也需要在 HTML 模板中使用 FormGroup、FormBuilder 等来组织表单。
在组件模块中导入 ReactiveFormsModule 模块:
import { NgModule } from '@angular/core'; import { BrowserModule } from '@angular/platform-browser'; import { FormsModule, ReactiveFormsModule } from '@angular/forms'; import { AppComponent } from './app.component';
@NgModule({ imports: [ BrowserModule, FormsModule, ReactiveFormsModule ], declarations: [ AppComponent ], bootstrap: [ AppComponent ] }) export class AppModule { }
在 HTML 模板中使用 FormGroup、FormBuilder:
import { Component } from '@angular/core'; import { FormBuilder, FormGroup } from '@angular/forms';
@Component({
selector: 'app-root',
template:
})
export class AppComponent {
myForm: FormGroup;
constructor(private fb: FormBuilder) { this.myForm = this.fb.group({ name: '' }); } }