• 使用angular 6 +ng-zorro-antd中的 Form表单 控制台报错


    错误代码:

    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的文档就动手实践了,知识体系不连贯导致出现了这个问题

  • 相关阅读:
    二叉排序树
    安全的终止线程的两种方法
    图的广度优先遍历(BFS)
    图的深度优先遍历(DFS)
    volatile的应用
    二叉树的遍历
    Java-反射
    Java--泛型
    单例模式
    剑指Offer--对称二叉树
  • 原文地址:https://www.cnblogs.com/Mxy-cnblog/p/10032929.html
Copyright © 2020-2023  润新知