错误代码:
Uncaught Error: Template parse errors:
Can't bind to 'formGroup' since it isn't a known property of 'form'. ("
<form nz-form [ERROR ->][formGroup]="validateForm" class="login-form" (ngSubmit)="submitForm()">
<nz-form-item>
"): ng:///AppModule/LoginComponent.html@1:18
No provider for ControlContainer ("
[ERROR ->]<form nz-form [formGroup]="validateForm" class="login-form" (ngSubmit)="submitForm()">
<nz-form"): ng:///AppModule/LoginComponent.html@1:4
No provider for NgControl ("
<nz-form-control>
<nz-input-group [nzPrefix]="prefixUser">
[ERROR ->]<input type="text" nz-input formControlName="userName" placeholder="Username">
</nz-input-g"): ng:///AppModule/LoginComponent.html@5:12
...
//后面还有一堆错误
执行过程
在vscode的集成终端里 执行 ng new project 后 ng add ng-zorro-antd
之后利用 ng-zorro-antd 的表单创建了一个组件ng g ng-zorro-antd:form-normal-login -p app --styleext=less --name=login
ng new project
ng add ng-zorro-antd
ng g ng-zorro-antd:form-normal-login -p app --styleext=less --name=login
在配置好了路由之后,运行项目,就出现了一开始的问题
解决办法
在app.module.ts里除了FormsModule还要引入ReactiveFormsModule
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
...
//放入import 数组里
import:[
...
ReactiveFormsModule
...
]
总结
用到了响应式表单,需要引入ReactiveFormsModule才行,因为没有看完Angular的文档就动手实践了,知识体系不连贯导致出现了这个问题