Angular12报Can't bind to 'formGroup' 引入表单模块仍未解决

这个报错绝大多数场景不是没导入响应式表单模块，是几个容易忽略的细节问题，按优先级排查即可：

• 第一处必改：模板绑定语法错误
  你当前模板里写的是formGroup="siteForm"，这是给form标签加了个值为字符串"siteForm"的普通HTML属性，Angular不会把它识别成ReactiveFormsModule提供的指令输入属性，自然会报“不是已知属性”的错。必须加方括号做动态属性绑定，写成[formGroup]="siteForm"才是正确写法：

<form [formGroup]="siteForm" (ngSubmit)="createNewSite()">
    <div class="form-group">
      <label>Nom du site</label>
      <input type="text" formControlName="siteName" class="form-control" required>
    </div>
    ...
    <button type="submit" class="btn btn-primary btn-sm">Envoyer</button>
  </form>

• 第二处调整：修正模块导入规则
  你现在在SiteModule里导入了BrowserModule，这是不符合Angular模块规则的：BrowserModule只能在根模块AppModule里导入一次，所有特性模块（比如你这个SiteModule）需要用到Angular内置指令时，导入CommonModule即可。特性模块重复导入BrowserModule会导致模块注入的指令被覆盖，直接造成表单指令识别失效。修正后的SiteModule代码参考：

import {NgModule} from '@angular/core';
import {CreateComponent} from './create/create.component';
import {ReadComponent} from './read/read.component';
import {CommonModule} from "@angular/common";
import {FormsModule, ReactiveFormsModule} from "@angular/forms";


@NgModule({
  declarations: [
    CreateComponent,
    ReadComponent
  ],
  imports: [
    CommonModule,
    FormsModule,
    ReactiveFormsModule
  ]
})
export class SiteModule {
}

• 第三处检查：模块与组件的声明关系
  1. 确认编写的SiteModule已经被加入到根模块AppModule的imports数组里，否则SiteModule里声明的组件、导入的表单模块根本不会被应用加载
  2. 确认CreateComponent只在SiteModule的declarations数组中声明过一次，不要在AppModule或者其他功能模块里重复声明这个组件。Angular规则中一个组件只能归属于一个模块，重复声明会导致组件无法继承对应模块导入的指令。
• 最后清缓存验证
  以上修改做完后，停掉本地的ng serve进程，删掉项目根目录下的.angular缓存文件夹，重新启动项目，避免旧编译缓存导致修改不生效。

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