问题标签 [router-outlet]

在我的 Angular5 应用程序中，我有一个名为“admin”（/admin）的路由器出口，它有子路由器“news”/admin/（admin:news），我想创建指向组件 CreatePostComponent/admin/（admin:news/）的链接最新帖子）。

这是我的路由器：

并在模板中链接：<a [routerLink]="['new-post']">New post</a>

这是工作，我的 url 更改为 /admin/(admin:news/new-post)，但我仍然看到 NewsComponent，而不是 CreatePostComponent。我应该如何正确地做到这一点？

另外，我可以在命名路由器出口中有普通类型的网址吗（/admin/news，而不是 /admin/(admin:news)）；

我使用 angular 5.2.0 并导航到：

对应于：

AlbumPageComponent html 包含：

对应于：

并且应该与<router-outlet name="popup"></router-outlet>放入经典的app.component.html 一起使用（这是一个简单的 Angular cli 生成项目）。

这不起作用，因为我在控制台中注意到错误的形成路径：

但是以这种方式使用时确实有效：

与 AlbumPageComponent 具有：

然后形成正确的路径：

请注意，两种情况的路由命令是相同的，这意味着：

问：这种routerLink方法有什么问题？怎么可能修好？

PS：我还在.angular-cli.json中使用： “baseHref”：“/albums/”，尽管我认为这没有理由成为问题

编辑

https://angular.io/guide/router#wrap-up-and-final-app中的示例也是如此。为了复制，您必须将<a/>for Contact复制到 CrisisCenterComponent html。这样，就像我一样，人们会[routerLink]在与 AppComponent 不同的组件中使用方法。直接在 AppComponent html 中使用该[routerLink]方法有效。

有没有办法更改命名路由器插座显示的 url，例如：

http://.../我/（我：个人）

至

http://.../我/个人

但功能保持不变？

我有从其他组件在路由器插座中调用的组件。在视图中，此组件显示为弹出窗口。在这个组件中，我有 View child 可以访问的子组件。问题是-当我尝试调用子组件方法时，我收到'... of UNDEFINED ...'。在调查时我注意到， ViewChild 是在创建 View 之前设置的，所以我们只是没有创建子组件。

这是弹出组件的打开方式：

在弹出组件中查看子项。发射 setter 时 V 为空。在弹出组件 html 子组件被声明为标签：

PS：这是设置 ViewChild 时的样子http://webdav.chisw.us/webdav/TYC.Web__-_Google_Chrome_2018-04-20_12.47.13.png

你好，我是 Angular 5 的新手，我在 appmodule 中提供了共享服务，这就是服务

子组件在里面router-outlet，然后在子组件中我调用addDetail()了方法，但是当我调用时父组件app.component没有更新countDetail，这是我的父组件

我无法让命名路由器插座在我的角度应用程序中工作。下面的模板有工作代码，然后下面是我尝试过的两个独立的东西，它们被注释掉了。它们被完全加下划线并导致此错误：

我需要使用命名的路由器插座，以便我可以在模板中的同一级别上获取路由项目，以便在它们上正确使用 cssFlex 或 cssGrid。我很感激你能提供的任何见解！如果您投反对票，请说明原因，以便我改进这个问题。谢谢。

我已经阅读了无数关于命名和嵌套路由器插座的资源，但发现这是最简单的。

模板：C:\Users\nvaughn\Documents\TFSHome\GWConnect\src\Gwi.WebUI\ClientApp\src\app\layout\user-management\user-management.component.html

路由模块：C:\Users\nvaughn\Documents\TFSHome\GWConnect\src\Gwi.WebUI\ClientApp\src\app\layout\user-management\user-management-routing.module.ts

不要认为这很重要，但无论如何都包括在内... 组件：C:\Users\nvaughn\Documents\TFSHome\GWConnect\src\Gwi.WebUI\ClientApp\src\app\layout\user-management\user-management.component。 ts

所以我有一个路由器插座，用于在另一个组件一侧的组件之间切换。我希望能够根据所容纳的组件更改出口宽度。目前我正在使用共享服务来确定：

在组件之间，我正在更改共享服务属性以确定类，从而确定宽度：

这被认为是好的做法还是有更好的方法来做到这一点？

编辑：更正代码

我有两个路由器插座，一个在 app-component.html 中作为根插座广告，另一个在 MarketComponent 中。

所需功能： 如果我访问“市场/咨询”、“市场/网络研讨会”、“市场/”，这些应该在 MarketComponent 中呈现。这工作正常。

但是，我想在根路由器插座中显示/呈现 ProductDetailComponent 组件（'market/productDetails'），即在我的 app.component.html 的路由器插座中，而不是在我的 MarketComponent 插座中。但它没有被渲染。当我点击第四个按钮时，即。Career Wizard，网址正在更改，但组件未实例化/呈现。我想如果我给根的路由器插座一个名字，那么它可能会起作用。所以我这样做了。

但这也行不通。网址正在更改，但未完成路由。知道为什么会这样吗？

我在我的模块上创建了路由并将其作为子模块导入。

在一个 module.Routing.ts

在 app.routing.ts

我有这个

现在当它成功重定向到第一个 homecomponent 时。但是当我尝试使用 url localhost/admin/products.

它给了我一个错误

我有 Angular 6 应用程序，并想在一个仪表板页面内创建多个路由器插座，但是当我命名插座时（例如，名称为“设置”的插座），我得到的 URL 看起来像/app/(settings:user-profile)，看起来很奇怪而不是用户-友谊赛。我可以有正常的 URL（例如/app/user-profile/，或/app/settings/user-profile至少）吗？