无法绑定到“ FormGroup”，因为它不是“ form”的已知属性。 （”

Question

app.module.ts

    import { BrowserModule } from '@angular/platform-browser';
    import { NgModule } from '@angular/core';
    import { FormsModule, ReactiveFormsModule } from '@angular/forms';
    import { AppRoutingModule } from './app-routing.module';
    import { AppComponent } from './app.component';
    import { InputFormatDirective } from './input-format.directive';
    import { ContactFormComponent } from './contact-form/contact-form.component';

    @NgModule({
      declarations: [
        AppComponent,
        InputFormatDirective,
        ContactFormComponent
      ],
      imports: [
        BrowserModule,
        AppRoutingModule,
        FormsModule,
        ReactiveFormsModule
      ],
      providers: [],
      bootstrap: [AppComponent]
    })
    export class AppModule { }

接触form.component.ts

    import { Component } from '@angular/core';
    import { FormGroup, FormControl } from '@angular/forms'


    @Component({
      selector: 'contact-form',
      templateUrl: './contact-form.component.html',
      styleUrls: ['./contact-form.component.css']
    })
    export class ContactFormComponent {
      form = new FormGroup({
        username: new FormControl(),
        password: new FormControl()
      });
    }

接触form.component.html

    <form [FormGroup]="form">
      <div class="form-group">
        <label for="username">Username</label>
        <input
            formControlName="username"
            id="username"
            type="text"
            class="form-control"
        />
      </div>
      <div class="form-group">
        <label for="password">Passowrd</label>
        <input
            formControlName="password"
            id="password"
            type="text"
            class="form-control"
        />
      </div>
    <button class="btn btn-info" type="submit">Sign Up</button>
    </form>

错误：

    Uncaught Error: Template parse errors:
    Can't bind to 'FormGroup' since it isn't a known property of 'form'. ("<form [ERROR ->][FormGroup]="form">
      <div class="form-group">
        <label for="username">Username</label>
    "): ng:///AppModule/ContactFormComponent.html@0:6
        at syntaxError (compiler.js:2426)
        at TemplateParser.push../node_modules/@angular/compiler/fesm5/compiler.js.TemplateParser.parse (compiler.js:20600)
        at JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._parseTemplate (compiler.js:26146)
        at JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._compileTemplate (compiler.js:26133)
        at compiler.js:26076
        at Set.forEach (<anonymous>)
        at JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._compileComponents (compiler.js:26076)
        at compiler.js:25986
        at Object.then (compiler.js:2417)
        at JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._compileModuleAndComponents (compiler.js:25985)

在这里，我越来越错误。

看起来我缺少什么。 我也将所有包都导入了我的应用程序模块中。 仍然无法弄清问题所在。

我检查了来自stackoverflow的其他答案，但无法修复。

请看一看。

展示

Can't bind to 'FormGroup' since it isn't a known property of 'form'. ("

Answer 1

只需将FormGroup属性更改为小驼峰情况： formGroup

<form [formGroup]="form">

那应该可以解决您的错误。

顺便说一句，我认为您使用的是这样生成的Angular Lint。