Angular9迁移后出现ngClass、ngModel绑定错误求助

针对你遇到的ngClass和ngModel绑定报错问题，按以下步骤排查解决：

• 确认组件所属模块的依赖导入
  如果HeaderComponent属于某个子功能模块（而非直接在AppModule中声明），必须在该子模块的imports数组里单独导入CommonModule和FormsModule。Angular的模块依赖是隔离的，根模块AppModule的导入不会自动传递给子模块。

• 修复模板中的无效语法
  你的input标签存在两处无效语法：

  1. 重复定义了class属性
  2. 重复定义了name属性
     这些问题会干扰Angular的模板解析，引发绑定错误。修改后的代码如下：

  <input type="text" name="userName" class="form-control user-icon" [(ngModel)]="user.username" [ngClass]="{'is-invalid': userName.errors && userName.touched}" #userName="ngModel" required minlength="2" maxlength="30">
  

• 清理缓存并重启开发服务
  版本迁移后可能存在缓存残留，执行以下命令清理并重启：

  ng clean
  ng serve --open
  

• 二次核对模块配置
  确认AppModule（或组件所属子模块）中：

  • FormsModule和CommonModule已正确加入imports数组
  • HeaderComponent已在declarations数组中声明，且无重复声明情况

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