问题标签 [router-outlet]

我在 app.module 中定义了以下路由：

在 SidebarModule 中，我定义了路线：

和 MainComponent 是：

当我导航到 时'main/(sidebar:sidebar1)'，我收到此错误：

这可能是由于子模块不知道侧边栏出口的事实造成的。我想用不同的子插座填充侧边栏（不暴露特定组件），有没有办法做到这一点？

在 中app.component.html，我设置了一个条件来决定使用哪种模板：

我试图在用户登录后将他重定向到应用程序的主页。为此，我使用以下命令：

通过使用这个我得到这个错误：

这让我感到不安，因为我在注销的另一种方式（从主页重定向到登录页面）做了完全相同的事情，并且一切正常。

我读了一些类似的答案，但到目前为止没有一个对我有帮助，因为我不想router-outlet在我的页面中添加标签，login.component.html因为主页不是登录页面的子组件。

我认为我的问题是我应该使用两个router-outlets 而不是登录选择器，但我无法让它正常工作。

我的app.routing.ts：

我是 angular 2 的新手，因为路由器插座是动态的，它们用 out 组件替换元素（如果我错了，请纠正我）。为什么使用路由器插座不显示我的组件？

这是我的路由配置：

在我的仪表板组件（当我登录时导航到）我有

问题是每当我取消注释“app-about”和“app-home”时，我都可以看到我的组件，否则我的页面上什么都没有。

也告诉我之间的区别

简单

我正在使用角度 4.0.2。我想为我的应用程序创建一个可重用的布局模块，该模块由一些带有导航栏、侧边栏等的 html 布局组成。模板包含路由器插座，但我不知道如何从外部注入路由。

这是我正在尝试的：

然后在 application.module 我将导入提供（特定于应用程序）路由的模块：

不幸的是，它不起作用。我的路线没有注册，我得到 404。

但是，当我将其更改为：

然后路由工作正常，除了它们没有作为依赖注入。

任何想法如何做到这一点？

我是否可以router-outlet在除AppComponent? 因为目前当我这样做并尝试使用它激活它时，[routlerLink]我在控制台中收到一个错误，抱怨它找不到名为 popup 的插座。如果我把它移回AppComponent它的工作原理！

所以这是我的项目的结构：

这是相关代码（landing.routing/landing.component.html）：

...最后是 app.routing.ts 路由：

我正在使用Angular 4项目，并且我曾经ngSwitch根据条件切换多个布局。所以，此时，我收到错误消息cannot find primary outlet to load Component。这是因为router-outlet但是解决这个问题的最佳方法是什么？

代码 ：

我有一个 main router-outlet，用于显示登录屏幕（/login）和主内容屏幕（登录后显示）（/main）。

一旦用户在内容屏幕上，我想在顶部显示一个导航栏，有 2 个选项（例如，“概述”、“见解”）。此导航栏常见于OverviewComponent和InsightsComponent

在此导航栏下方，我想显示另一个路由器插座，它将根据用户在导航栏中单击的内容加载OverviewComponent或。InsightsComponent如果我将“/overview”和/“insights”作为路线，它将直接向我显示相应的组件，而不是导航栏。

以下是我当前的路由配置（这是不对的）：

请让我知道我们是否可以在 angular2 angular4 中实现这一点。我正在使用以下版本：

******************尝试2 - 仍然不工作******************

*******尝试 2 - 包含所有组件的 Sudo 代码 - 仍然无法正常工作*******

********尝试3 - 工作********

在 Angular2 应用程序中，我使用 Bootstrap 的网格。模块的主要组件的模板提供了一个网格的行：

并且子组件具有 Bootstrap 的网格列：

问题是 Angular2 生成了这样一个 HTML：

所以：它添加了一个ng-component标签，它破坏了 Bootstrap 所需的结构（列块必须是行块的子块）。

如何防止生成ng-component标签？

我正在尝试为具有相互依赖组件之类的 Angular 2 应用程序找到一个好的结构。

这是问题的基本思想：应该有侧导航菜单组件和一个包含路由器插座的内容区域。对于某些路线，侧组件应该包含一个额外的导航组件（例如，用于快速访问的项目列表，其中主要内容区域是“详细视图”）。

菜单应该是一个独立于任何其他组件或功能区域的组件，并且不应该知道额外的导航组件，但它应该包装这个组件。

一种实现方式是仅定义顶级组件，并在由路由定义的每个屏幕中提供 HTML 模板中的侧边菜单。在我看来，这是一个糟糕的设计，因为部分 HTML 代码是重复的。

另一种选择是在菜单组件中的活动路线上创建一个开关，并在那里包含正确的导航片段，但这会将路线（屏幕）的逻辑传播到几个组件中，这对我来说似乎是一个更糟糕的设计。

为导航片段使用命名路由器插座也不是正确的方法，因为组件不是彼此独立显示，而是始终在一起显示。手动修改路线（清除导航片段部分）会破坏设计。

我还没有设法在角度文档中为这种用例找到一个好的设计。我在这里错过了什么吗？

到目前为止，我还没有在命名路由器出口 ex 中找到延迟加载的工作演示<router-outlet name="view"></router-outlet>。我做了一个 plunkr 来找到一种方法让它在没有成功的情况下工作。任何帮助将非常感激。

https://plnkr.co/edit/EW3PZUMC63euf2QYxtW5?p=preview

在上面的示例中，View1、View2 和 View3 在默认路由器插座中延迟加载。View3_1 和 View3_2 被延迟加载到指定的路由器出口中，但没有成功。