Angular11响应式表单报错formGroup不是form的已知属性如何解决

Can't bind to 'formGroup' since it isn't a known property of 'form' 报错本质是Angular无法识别formGroup指令，对应你的代码场景，核心原因是声明CustomerComponent的CustomerModule未正确导入响应式表单所需的依赖模块。

• 第一步：给CustomerModule手动导入ReactiveFormsModule
  这是你当前代码最直接的问题，当前CustomerModule的imports数组里只有SharedModule，未引入响应式表单的核心依赖。修改customer.module.ts代码如下：

import { NgModule } from '@angular/core';
import { ReactiveFormsModule } from '@angular/forms'; // 新增导入
import { SharedModule } from 'src/app/shared/shared.module';
import { CustomerComponent } from '../customer/customer.component';

@NgModule({
  declarations: [CustomerComponent],
  imports: [
    SharedModule,
    ReactiveFormsModule // 新增到imports数组
  ],
  exports: [CustomerComponent]
})
export class CustomerModule { }

• 第二步：如果你的项目是把公共依赖放在SharedModule里统一导出，请检查SharedModule的配置
  如果你不想在每个业务模块单独导入ReactiveFormsModule，就需要在SharedModule中同时完成导入和导出：

// shared.module.ts 示例
import { NgModule } from '@angular/core';
import { ReactiveFormsModule } from '@angular/forms';

@NgModule({
  imports: [ReactiveFormsModule], // 先导入
  exports: [ReactiveFormsModule] // 再导出，其他导入SharedModule的模块才能使用相关指令
})
export class SharedModule { }

• 第三步：额外排查点
  检查CustomerComponent是否被重复声明在多个模块中，若存在重复声明请删除多余的声明代码，保证组件仅属于一个模块。

你当前的HTML代码中input标签未绑定formControlName，修复完上述报错后需要给每个input加上对应绑定，才能正常获取表单值，示例如下：

<input type="text" formControlName="firstName" />

内容的提问来源于stack exchange，提问作者Tom