Angular 6:无法绑定到"FormGroup"，因为它不是"form"的已知属性 [英] Angular 6: Can't bind to 'FormGroup' since it isn't a known property of 'form'

问题描述

我是Angular 6的新手，正在研究ReactiveForms.收到此错误，无法编译.我已经看到了不同的解决方案，并按照解决方案中的建议在Imports中添加了ReactiveFormsModule指令，但它仍显示相同的错误.请帮忙.

I am new to Angular 6 and working on ReactiveForms. Getting this error and unable to compile. I have seen the different solutions and Added the ReactiveFormsModule directive in Imports as suggested in solutions still it is showing the same error. Please Help.

为您共享所需的代码和错误的屏幕截图. app.module.ts

Sharing you the desired code and screenshot of the error. app.module.ts

import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { SignupFormComponent } from './signup-form/signup-form.component';
import { AuthorsService } from './authors.service';
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

@NgModule({
  declarations: [
    AppComponent,
    SignupFormComponent,
    CoursesComponent,
    CourseComponent,
    AuthorsComponent,
    FavoriteComponent,
    TitleCasePipe,
    PanelComponent,
    LikeComponent,
    ZippyComponent,
    ContactFormComponent,
    NewCourseFormComponent
  ],
  imports: [
    BrowserModule,
    FormsModule,
    ReactiveFormsModule
  ],

Signup-form.ts

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

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

}

signup-form.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">Password</label>
        <input 
            formControlName="password"
            id="password" 
            type="text" 
            class="form-control">
    </div>
    <button class="btn btn-primary" type="submit">Sign Up</button>
</form>

错误屏幕截图

推荐答案

请在HTML下方使用

<form [formGroup]="form">
...
</form>

存在错误，因为您在[formGroup]中使用了大写字母F.

The error is there since you are using capital F in [formGroup].

这篇关于Angular 6:无法绑定到"FormGroup"，因为它不是"form"的已知属性的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！