在我的 Angular 2 应用程序中，我试图重现这个导航结构:
我的根应用程序组件中有一个大路由器导出，我在其中加载我的营销网站，或者在用户登录时加载我的应用程序。
因此，一旦用户登录，MyComponent(栗色)就会加载到红色路由器 socket 中，并且它有一个导航栏(MyHeader，黑色和灰色)，并且它的自己的路由器 socket (蓝色)。当我单击导航栏中的主页时，它会将仪表板组件加载到蓝色路由器 socket 中，一切看起来都很好。但是，当我单击 Benefits 链接时，我希望它将 BenefitsModule 中的 BenefitsComponent(橙色和黄色)加载到蓝色路由器 socket 中。但相反，它似乎将它加载到红色路由器导出，即来自 AppComponent 的路由器导出，因为来自 MyComponent 的导航栏消失了。
我创建了一个 simplified version of my project on Github .
显然我缺少了一些东西。谁能帮我弄清楚发生了什么？
编辑:只是为了添加一点上下文，我正在尝试通过延迟加载福利模块来修改我的路由结构。最初我延迟加载了每个模块，但它在这里并不是很有用，因为 yield 部分应该与我的应用程序的登录部分一起加载。最初，我有这个延迟加载:
- 在
my.module.ts中我没有提到BenefitsModule因为它是延迟加载的 在
my-routing.module.ts中我有一个额外的行来加载模块:{ 路径:'benefits'，loadChildren:'app/my/benefits/benefits.module#BenefitsModule'，canActivateChild:[AuthGuard]}
在
benefits-routing.module.ts中我没有提到benefits路径，因为它存在于my-routing.module 中.ts
这非常有效。正如您在 the lazy-loading branch of my repository 中看到的那样.所以我想我的问题是如何在不丢失导航结构的情况下从这种延迟加载情况转变为急切加载情况。
编辑 2:在每个路由器 socket 上使用 activate 事件，我只是确认在使用延迟加载时，我的好处组件已加载到 MyComponent 中的路由器 socket 但没有延迟加载，它是加载到根 AppComponent 路由器导出。
最佳答案
所以我调查了你的问题。问题是您希望将 BenefitsComponent 加载到 MyComponent 中。但是，如果它不是 MyComponent 的子组件，他怎么能这样做呢？因此，为了解决这个问题，您需要像延迟加载时一样将其添加到子列表中。唯一的问题是，你不想在这里延迟加载。但是自从路由器的 RC6(以及因此发布)以来，您可以只传递一个返回模块的函数。这使得切换到延迟加载也非常简单，只需删除导入并使用字符串文字指向模块。
我向您的 GitHub 存储库添加了一个 PR 以向您展示它是如何工作的。 https://github.com/sarbogast/ng2-routing-example/pull/1
关于angular - Angular 2 路由问题 : feature module doesn't load in the right place，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/40846622/