模板驱动型表单：所有逻辑都在html中，包括数据校验逻辑和变量定义都在html中。
响应式表单：把功能性的内容移到了代码里面。
动态表单：表单几乎全部是用代码创建的。
模板驱动表单：
#form="ngForm"
#password="ngModel"
响应式表单：
formBuilder
动态表单：
html仅仅充当容器的作用，大部分逻辑都在class里。
有些业务表单根据用户权限的不同，根据用户角色的不同，能够让用户输入不同的内容。
数据校验：
自定义校验规则：
自定义校验规则，实际上是实现了一个指令。
模板驱动表单例子
<form #f=ngForm (ngSubmit)="onSubmit(f,$event)"> <div mat-dialog-content> <mat-form-field class="full-width"> <input [(ngModel)]="desc" required type="text" matInput placeholder="在这里快速简历一个任务" style="text-align: right" name="desc"> <button matSuffix mat-icon-button type="submit"> <mat-icon>send</mat-icon> </button> <mat-error>不能为空</mat-error> </mat-form-field> </div> </form> <div> 表单数据：{{f.value | json}} </div> <div> 表单验证状态：{{ f.valid | json }} </div>
onSubmit(f: NgForm, event: Event) {
console.log(f)
console.log(JSON.stringify(f.value));
console.log(JSON.stringify(f.valid))
}
2020-06-02
原文：https://www.cnblogs.com/starof/p/13029012.html