问题标签 [routerlink]

我正在使用 TypeScript 学习 Angular JS。我有 Angular JS 的经验。但是当它与 TypeScript 集成时，它对我来说是全新的。我现在正在为我的应用程序配置路由。

我在该文件中配置了路由。当我直接从浏览器访问路由时，它正在工作。然后我尝试在 app.component.html 中添加链接。这是我的 app.component.html

然后我点击链接。两者都没有工作。但是当我直接在 URL 栏中输入路由值时，它就可以工作了。我的 HomeComponent 和 DirectoryComponent 很简单。他们只是在显示一条消息。

当我第一次访问“/目录”网址时它正在工作。它显示目录页面。从那里当我单击主页链接时，它会更新到主页。但网址仍然是“目录”。但是当我再次单击目录链接时，什么也没有发生。

我遵循了这些解决方案

routerLink 在角度 2 中不起作用

routerlink在angular2中不起作用

路由器链接不工作

都没有工作。

我检查了 HTML 元素，它正在正确呈现链接。问题是当我点击链接时，什么也没有发生。

我正在使用最新版本的 Angular JS。我的代码有什么问题？

我无法使用 v-for 指令正确渲染路由器链接。

我想要的是，我希望侧边菜单有一个链接，将用户引导到 url 与侧边菜单元素的名称对应的页面。
因此，如果元素是 'HOME'，它应该指向
myproject.com/HOME。
然而，不知何故，它在渲染时变成了
myproject.com/Campaign/Campaign/Campaign/HOME
。

我真的不知道发生了什么，我正在寻求帮助。

上面的结果是：

假设我的网站上有一个徽标，我应该这样链接它：

或者可能是这样的：

头条呢？

相对

处理这个的正确方法是什么？这还重要吗？如果我使用 routerLink，添加 HTML 锚标记是否有任何语义价值？

我正在学习 Angular 和 TypeScript。现在我正在开发一个简单的应用程序，只是为了学习目的。我在使用 routeLink 时遇到问题。我的 routeLink 之一是向现有的 HTML 添加新的 HTML，而不是替换它。我有一个复杂的组件树视图和结构。

这是我的主要 app-routing.module：

我的 app.component.html：

所以我会有独立的 LayoutModule 和它的路由配置：

我的 layout.component html

同样，我将拥有结果模块及其路由配置。

这是我的结果-routing.module 配置：

这是我的结果.component.html：

所以根据我的代码，如果我访问“结果/添加”和“结果/列表”，它将使用相应的组件。在此阶段之前，我的路线配置仍然可以正常工作。当我访问“outcome/add”url 时，outcome.component.html 中的 route-outlet 将替换为“outcome/list”的 CreateOutcomeComponent 和 ListOutcomeComponent。问题始于 ListOutComponent。

这是我的 create-outcome.component.html

这是我的 list-outcome.component.html

如您所见，我在 list-outcome.component.html 中创建了一个链接（routerLink），该链接导航到“结果/添加”。因此，如果我单击该链接，当前现有的整个内容应该被 CreateOutcomeComponent 的 HTML 内容替换，包括链接（锚点）本身。但是当我单击链接时，内容不会被替换，而是会附加或附加到现有内容中。

当我访问“结果/列表”时，这就是我所看到的：

如果我单击该按钮，它应该被 CreateOutcomeComponent 中的内容替换。但这发生了，当我这样做的时候。

正如您在屏幕截图中看到的那样，内容被添加到现有内容的顶部。但它应该被替换。为什么是这样？我该如何解决这个问题？

但是，当我直接从进入浏览器的 URL 访问“结果/添加”时，它按预期工作。

我正在阅读 routerlink 隐式调用 relativeTo 而 this.router.navigate 没有。

知道这些信息，我似乎仍然无法使以下工作。

routerlink 工作并给了我以下地址：

http://localhost/main/(aux:crypto/5a599f35af967b0017d1be6f/blogoutlet:steemblog:)

但：

 this.router.navigate([{outlets: { 'blogoutlet' : ['steemblog']}}])

只给出：

http://localhost/main/(aux:crypto/5a599f35af967b0017d1be6f)

每次我试图改变这些路径时，我都很难理解正在发生的事情，而且我需要很长时间才能解决这个问题。我可以遵循一个简单的规则吗？

如果路由器链接中有设置方法，则使用 vuejs 2.5

? 我试过这样：

但失败了……

谢谢！

在 *ngFor 循环中，我正在构建带有示例阅读文本的搜索结果列表（垫卡），我希望允许用户单击其中一个以阅读更多内容，并打开到填充的文档模板的路线与正确的文档。

此静态 HTML 与 routerlinkactive 一起使用，以捕获 docview 页面中的参数...

我想通过 *ngFor 将硬编码的 Doc ID 'AW010001' 替换为每次迭代的适当 ID。但是这段代码失败了......

我得到的错误是典型的......

解析器错误：在 [['/docview', {[sDocName]:'{{sDocIDs[i]}}' }]] 的第 25 列预期表达式出现插值 ({{}})

我有 2 个组件 1 个用于导航，一个用于页面内容，RouterLink 将路由路径添加到当前路由，例如，如果此路由

这是 routerLink 代码

当我导航到主路由或其他任何东西并且我想转到 mygames 路由时，假设链接将是 localhost:4200/mygames/id 但
路由器链接是

localhost:4200/home/mygames/user_id

甚至在 home route 这个路由的 routerLink 是

我不知道听到什么问题以及如何解决

我有一个带有下一个布局的 Angular 单页网站

（其中 pageN_Id 是组件变量）

当我单击标题的链接 pageN 时，窗口将滚动到 pageN（使用页内导航，<a href="#someId">）

现在我想在单击链接时向 a-link 元素添加一个“活动”css-class。

我知道指令routerLink和routerLinkActive，但是如何将它们与页内链接一起使用（而不是简单的页间链接）

如何向路由器链接添加查询，以便通过单击通知中的链接将用户重定向到帖子下的评论？

API 为我们提供anchor了通知和id评论。当 DOM 渲染一个页面时，它首先加载一个帖子，然后是评论。

这是通知的一个组成部分：