Question

我用2个心情创建了一个新应用，当我尝试向我的模块之一添加表格时出现错误：

Can't bind to 'formGroup' since it isn't a known property of 'form'.

我知道这是一个非常普遍的问题，因此我在编写此票证之前先用Google搜索一下并确保在模块中有ReactiveFormsModule。但是我仍然看到错误，因此问题显然存在，因为这是我的代码：

// app.module.ts
@NgModule({
  declarations: [AppComponent],
  imports: [
    AppRoutingModule,
    BrowserModule,
    HttpClientModule,
    ReactiveFormsModule,
  ],
  providers: [
    // My providers
  ],
  bootstrap: [AppComponent],
})
export class AppModule {}

在App modul中，一切正常，如果我尝试使表单正常运行，则没有任何问题。

// auth.module.ts
@NgModule({
  imports: [CommonModule, ReactiveFormsModule, RouterModule],
  declarations: [LoginComponent],
  providers: [
    // My providers
  ],
})
export class AuthModule {}

在我的LoginComponent（在AuthModule中注册的）内部，我有如下代码：

  public form: FormGroup;

  constructor(private fb: FormBuilder) {}
  public ngOnInit(): void {
    this.form = this.fb.group({
      username: ['', [Validators.required]],
      password: ['', Validators.required],
    });
  }

我的模板很简单：

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

我验证了在我的两个模块中都导入了ReactiveFormsModule以及保存了所有内容的百万时间。我多次重新启动CLI，以确保它不会冻结在某个地方。

我不知道我在做什么错。

Answer 1

您需要在您的emsdk

中同时导入两者 FormsModule和ReactiveFormsModule

AuthModule

Answer 2

您应该将AuthModule导入到您的AppModule中。 Refer Documentation

// app.module.ts
@NgModule({
  declarations: [AppComponent],
  imports: [
    AppRoutingModule,
    BrowserModule,
    HttpClientModule,
    ReactiveFormsModule,
    AuthModule
  ],
  providers: [
    // My providers
  ],
  bootstrap: [AppComponent],
})
export class AppModule {}

角度-无法绑定到“ formGroup”，因为它不是“ form”的已知属性

2 个答案: