如何使用Angular mat-chip-row？导入模块仍报NG 8001错误求助

• 先纠正一个错误操作：组件文件里不需要导入MatChipsModule，这是模块层面的配置，只有NgModule（比如AppModule或者你的业务模块）才需要导入它。

具体解决步骤 #

1. 确认模块导入范围

   • 如果你的组件属于AppModule，那确保AppModule的imports数组里确实加了MatChipsModule；如果组件属于其他独立的Feature Module，必须在那个Feature Module的imports里也加上MatChipsModule，不能只在AppModule里导。

2. 共享模块要配置导出

   • 要是用了SharedModule来统一管理Material组件，得在SharedModule的imports和exports里都放MatChipsModule，不然其他模块导入SharedModule也用不了这个组件：

     @NgModule({
       imports: [MatChipsModule],
       exports: [MatChipsModule]
     })
     export class SharedModule {}
     

3. 检查版本匹配

   • 确保@angular/material和@angular/core的版本完全一致，版本不兼容会导致组件识别失败。输命令查版本：

     npm list @angular/material @angular/core
     

   • 版本不一样的话，把material更到和core相同的版本，比如core是15.2.0，就跑：

     npm install @angular/material@15.2.0 --save
     

4. 清缓存重启服务

   • 缓存可能导致模块更新不生效，按Ctrl+C停掉服务，删了node_modules/.cache（或者直接删node_modules再重新npm install），然后重新启动ng serve。

5. 修复模板语法错误

   • 你的模板里*ngFor=let key of courseLookup"少了前引号，正确写法是*ngFor="let key of courseLookup"，这种语法错误可能让Angular解析模板时出问题，间接引发组件识别报错。

内容的提问来源于stack exchange，提问作者Rachel Karen Green