Angular 8.0.0用ngx-file-viewer遇报错及改代码后新问题求助

咱们一步步来搞定你遇到的这两个问题：

1. 先解决「Cannot find name 'module'」错误 #

这个报错是因为TypeScript编译器识别不了全局的module变量，大概率是ngx-file-viewer内部代码或者你的项目配置里用到了Node.js风格的模块语法，但你的TypeScript配置没包含Node.js的类型定义。按下面步骤修复：

• 首先安装Node.js的类型定义包：

  npm install @types/node --save-dev
  

• 然后打开项目里的tsconfig.json（Angular项目可能是tsconfig.app.json），找到compilerOptions下的types数组，把node加进去：

  {
    "compilerOptions": {
      // ...其他配置项
      "types": ["node"]
    }
  }
  

  如果原本没有types字段，直接新增即可。

2. 修正滚轮事件的类型问题 #

你修改后的MouseWheelEvent其实是非标准的旧别名，在Angular 8对应的TypeScript版本里，标准的滚轮事件类型是WheelEvent。建议把参数类型改成WheelEvent，既符合规范又能避免类型报错：

@HostListener('wheel', ['$event']) 
onWheel(event: WheelEvent) { 
  this.changeZoom(event.deltaY / 2400); 
  // 注意：deltaY的方向和旧的wheelDelta相反，如果发现缩放方向不对，可以改成 -event.deltaY / 2400
  return false; 
}

额外建议：确认组件版本兼容性 #

因为你用的是Angular 8，建议检查下当前安装的ngx-file-viewer版本是否适配Angular 8。有些旧版本的组件在新Angular环境里会有类型适配问题，你可以查看组件的npm说明文档，找到适配Angular 8的版本号后重新安装：

npm install ngx-file-viewer@<兼容版本号> --save

这样应该就能解决所有问题了。

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