Angular懒加载路由报错No provider for ChildrenOutletContexts!求解决

问题根源 #

你给RoutingExampleComponent配置了嵌套的children路由，但**RoutingExampleComponent的模板里没有添加<router-outlet>**。Angular需要这个出口来渲染子路由对应的组件，而ChildrenOutletContexts服务正是为嵌套路由的<router-outlet>提供上下文支持的——缺少这个出口时，Angular找不到该服务的提供者，就会抛出这个错误。

修复方法 #

打开RoutingExampleComponent对应的模板文件（例如routingexample.component.html），添加路由出口标签：

<!-- routingexample.component.html -->
<router-outlet></router-outlet>

验证现有配置逻辑 #

你的路由配置本身是合理的：

• AppRoutingModule通过RouterModule.forRoot()配置懒加载规则，指向RoutingExampleModule
• RoutingExampleRoutingModule使用RouterModule.forChild()定义嵌套路由，将空路径映射到RoutingExampleComponent，同时配置了comp1、comp2子路由及默认重定向规则
  补充父组件的路由出口后，嵌套路由就能正常工作，错误也会消失。

内容的提问来源于stack exchange，提问作者Abhijith Nayak