ng serve报错Error: NG0202 - Angular10升15动态组件问题

NG0202是Angular的依赖注入循环依赖错误，结合你以动态组件为核心的应用场景，以下是具体排查方向：

• 动态组件相关的DI循环
  检查动态组件本身与依赖的服务/组件是否存在直接或间接的循环引用（比如组件A注入服务B，服务B又依赖组件A）。Angular 15对DI循环的检测比10更严格，之前未触发的隐式循环会被拦截。同时注意动态组件构造函数中是否注入了负责创建它的父组件或服务，这是动态组件场景常见的循环来源。

• 模块层面的循环导入/声明
  排查动态组件所在模块与其他模块的导入关系，是否存在ModuleA导入ModuleB、ModuleB又导入ModuleA的循环。另外，Angular 13+已废弃entryComponents配置，若升级时未清理旧配置，可能与新的组件注册逻辑冲突，引发DI错误。

• 服务间的循环依赖
  重点检查与动态组件创建相关的核心服务，是否存在ServiceA注入ServiceB、ServiceB又注入ServiceA的循环。升级时若将服务从模块级provided改为root级，可能意外引入循环依赖。

• 延迟加载与动态组件的冲突
  若动态组件来自延迟加载模块，检查该模块与主模块的依赖是否形成循环。Angular 15对延迟加载的DI隔离逻辑更严格，之前的兼容处理可能失效。

• 调试技巧

  1. 启用AOT编译：在angular.json中设置"aot": true，运行ng serve --verbose，AOT模式会输出更具体的循环依赖节点信息。
  2. 在组件/服务的构造函数中临时添加console.log，打印加载顺序，定位循环链的起点。

内容的提问来源于stack exchange，提问作者Shikhar Ambashta