Angular 13.3.9中[(ngModel)]报错：Property 'ɵunwrapWritableSignal'不存在

问题描述 #

使用Angular 13.3.9版本，已在模块中导入FormsModule和CommonModule，但输入框的[(ngModel)]双向绑定无法正常工作，报错信息如下：

Property 'ɵunwrapWritableSignal' does not exist on type 'typeof import("e:/project/eCeiling/e-ceiling/node_modules/@angular/core/core")'

相关输入框代码：

<input type="number" name="size" matInput style="font-weight: sbold;" [(ngModel)]="gridsize" placeholder="Records in percent(%)" min="0" max="100" (input)="updateSetting(gridsize)" required>

问题原因 #

这个错误的核心是**@angular/forms包版本与@angular/core版本不兼容**：ɵunwrapWritableSignal是Angular 14及以上版本才引入的内部API，如果你的@angular/forms被意外升级到了14+版本，但@angular/core仍停留在13.3.9，就会出现这种跨版本API找不到的报错。

解决步骤 #

1. 检查包版本一致性
   执行命令查看当前Angular各核心包的版本：

   ng version
   

   或直接打开项目根目录的package.json，确认所有@angular/*开头的包（如@angular/core、@angular/forms、@angular/common）版本均为13.3.9。

2. 统一包版本
   如果发现@angular/forms版本高于13.3.9，执行以下命令将其降级到对应版本：

   npm install @angular/forms@13.3.9 --save
   

3. 清理并重新安装依赖

   • 删除本地依赖文件夹和锁文件：
     Windows系统：

     rmdir /s /q node_modules && del package-lock.json
     

     macOS/Linux系统：

     rm -rf node_modules package-lock.json
     

   • 重新安装依赖：

     npm install
     

4. 确认模块导入正确性
   再次检查组件所属的NgModule，确保FormsModule已正确导入，无重复或错误导入：

   import { NgModule } from '@angular/core';
   import { CommonModule } from '@angular/common';
   import { FormsModule } from '@angular/forms';
   import { YourComponent } from './your.component'; // 替换为你的组件类名
   
   @NgModule({
     declarations: [YourComponent],
     imports: [
       CommonModule,
       FormsModule
     ]
   })
   export class YourModule { } // 替换为你的模块类名
   

内容的提问来源于stack exchange，提问作者Gopal k .Dwivedi