Angular新项目中属性指令[ngSwitch]等被标记为错误求助

针对你遇到的项目运行正常但编辑器标红的问题，试试下面这些实操方案：

• 匹配Angular Language Service版本
  确保ALS版本和你的Angular项目版本完全一致，不要直接装最新版（可能存在兼容问题）。在项目根目录执行：

  npm install @angular/language-service@16.1.6 --save-dev
  

  安装完成后重启VS Code。

• 重启TypeScript服务
  打开VS Code命令面板（Ctrl+Shift+P），输入TypeScript: Restart TS Server，重启后编辑器会重新解析项目文件，很多缓存导致的标红问题能直接解决。

• 确认CommonModule的导入位置
  别只在AppModule里导入CommonModule，要确保组件所属的模块/独立组件里也导入了：

  • 如果是NgModule结构：在组件所在模块的imports数组中添加CommonModule
  • 如果是独立组件（standalone: true）：在组件的imports数组里直接导入CommonModule

• 重置VS Code插件设置
  打开VS Code设置，搜索Angular Language Service：

  • 确认Enable选项已勾选
  • 检查Workspace Version是否识别到了16.1.6版本，若没识别，手动指定项目根目录的TypeScript路径

• 清理缓存

  1. 清理项目依赖缓存：删除node_modules、package-lock.json，重新执行npm install
  2. 重载VS Code窗口：按Ctrl+Shift+P，输入Developer: Reload Window，强制刷新编辑器状态

这些步骤基本能解决大部分编辑器标红但运行正常的问题，本质多是Angular Language Service的解析缓存或版本不匹配导致的。

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