升级至Angular 17后编译出现Ng-Zorro-Antd包错误

错误详情 #

Error: node_modules/ng-zorro-antd/tree-view/toggle.d.ts:10:9 - error TS2611: 'recursive' is defined as a property in class 'CdkTreeNodeToggle<T, T>', but is overridden here in 'NzTreeNodeToggleDirective' as an accessor.

10 get recursive(): boolean;

当前使用版本 #

• Ng-Zorro-Antd版本："ng-zorro-antd": "^17.1.0"
• Angular相关依赖版本：

  "@angular/animations": "^17.1.3",
  "@angular/cdk": "^17.1.2",
  "@angular/common": "^17.1.3",
  "@angular/compiler": "^17.1.3",
  "@angular/core": "^17.1.3",
  "@angular/forms": "^17.1.3",
  "@angular/platform-browser": "^17.1.3",
  

问题原因 #

这个编译错误是因为Ng-Zorro 17.1.0的NzTreeNodeToggleDirective用getter访问器重写了Angular CDK 17.1.x里CdkTreeNodeToggle类的recursive普通属性，而TypeScript的严格类型检查不允许这种重写方式，属于版本兼容问题。

解决方案 #

1. 升级Ng-Zorro到修复版本（推荐）
   Ng-Zorro团队已经在17.1.1版本修复了这个CDK兼容性问题，直接升级即可解决：

npm install ng-zorro-antd@^17.1.1 --save

如果用Yarn：

yarn add ng-zorro-antd@^17.1.1

2. 临时规避方案（仅应急）
   如果暂时无法升级，可以在tsconfig.json的compilerOptions里开启skipLibCheck跳过库类型检查，但这会忽略所有第三方库的类型问题，不建议长期使用：

{
  "compilerOptions": {
    // 保留原有配置
    "skipLibCheck": true
  }
}

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