Angular-表单相关
响应式表单
响应式表单提供了一种模型驱动的方式来处理表单输入,其中的值会随时间而变化。
要点:
1.要使用响应式表单,必须从@angular/forms导入ReactiveFormsModule
import { ReactiveFormsModule } from '@angular/forms';
@NgModule({
imports: [
// other imports ...
ReactiveFormsModule
],
})
export class AppModule { }
2.要注册单个的表单控件,请在组件中导入FormControl类,并创建一个FormControl的新实例,把它保存在类的某个属性中。
import { Component } from '@angular/core';
import { FormControl } from '@angular/forms';
@Component({
selector: 'app-name-editor',
templateUrl: './name-editor.component.html',
styleUrls: ['./name-editor.component.css']
})
export class NameEditorComponent {
name = new FormControl('');
}
3.在模板注册该控件:为表单控件添加formControl绑定。(formControl 是由 ReactiveFormsModule 中的 For