带有路由参数的 angular 2 routerLink 仅用作字符串

omarCreativeDev

我有一个参数定义为的路线
export const jobDetailsRoute: Route = { path: 'job-detail/:jobId/:jobTitle', component: JobDetailsComponent, };

我像这样导入到我的组件中
public readonly jobDetailsRoute: Route = jobDetailsRoute;

但是,当我参考下面的路线时,它会生成一个无效链接
http://mydomain/job-detail/%3AjobId/%3AjobTitle/oNPj5fwK/Dynamics%20365%20Developer

<a [routerLink]="[ jobDetailsRoute.path, job.id, job.title ]" [translate]="'DASHBOARD.ANCHOR'"></a>

在控制台中引发以下错误
无法匹配任何路由。URL 段:'job-detail/%3AjobId/%3AjobTitle/oNPj5fwK/Dynamics%20365%20Developer'

当我将 routerLink 生成为字符串时,我得到了一个正确的链接 http://mydomain:4200/job-detail/oNPj5fwK/Dynamics%20365%20Developer

<a [routerLink]="[ 'job-detail', job.id, job.title ]" [translate]="'DASHBOARD.ANCHOR'"></a>

我哪里出错了?

安吉特·萨洛克

routerLink期望的路径段。因此,在第一种情况下,当您使用 时jobDetailsRoute.path,带有动态线段的整个路线将连接起来以生成完整路线。

例如 ['/team', teamId, 'user', userName, {details: true}] 意味着我们要生成一个指向 /team/11/user/bob;details=true 的链接。

来源

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

Angular Routerlink:用变量连接父路由字符串

来自分类Dev

Angular2 routerLink指令动态参数?

来自分类Dev

Angular 2 Routerlink *ngIf 带参数

来自分类Dev

带有routerLink的兄弟姐妹之间的Angular 2辅助路由

来自分类Dev

如何在Angular 2中访问没有参数的routerlink

来自分类Dev

Angular 2-带有路由器出口的子路由

来自分类Dev

Angular服务,带有路由参数的$ http.get()?

来自分类Dev

Angular服务,带有路由参数的$ http.get()?

来自分类Dev

Angular2 Routerlink:添加查询参数

来自分类Dev

Angular 2 RouterLink用于选择

来自分类Dev

Angular 2 Routerlink在for循环中

来自分类Dev

带有参数的 Angular 2 路由充当通配符路由

来自分类Dev

使用带有路由的ngUpgrade引导Angular 2 rc.6混合应用程序

来自分类Dev

带有路由器出口的Angular2组件通信

来自分类Dev

带有附加 url 的 angular2 路由参数

来自分类Dev

Angular2 Beta出现异常“路由器没有提供者!(RouterLink->路由器)”

来自分类Dev

Angular2 RouterLink通过将斜杠替换为%2F来中断路由

来自分类Dev

Angular 2 RouterLink改写了URL?

来自分类Dev

在Angular 2中测试routerLink指令

来自分类Dev

单击任何[routerLink]时的Angular 2事件

来自分类Dev

Angular2主机:{'[routerLink]':'/ foo'}

来自分类Dev

Angular 2 RouterLink改写了URL?

来自分类Dev

在Angular 2中使用routerLink

来自分类Dev

来自Angular2中Object的routerLink

来自分类Dev

Angular2 Router 3.0 beta 1(通过Routerlink的子路由失败)

来自分类Dev

Angular 2在子节点中添加指向根路由器的routerLink

来自分类Dev

Angular2 Router 3.0 beta 1(通过Routerlink的子路由失败)

来自分类Dev

带有查询字符串的 Angular 5 路由

来自分类Dev

Angular2路由配置(带有两个参数的路由)

Related 相关文章

  1. 1

    Angular Routerlink:用变量连接父路由字符串

  2. 2

    Angular2 routerLink指令动态参数?

  3. 3

    Angular 2 Routerlink *ngIf 带参数

  4. 4

    带有routerLink的兄弟姐妹之间的Angular 2辅助路由

  5. 5

    如何在Angular 2中访问没有参数的routerlink

  6. 6

    Angular 2-带有路由器出口的子路由

  7. 7

    Angular服务,带有路由参数的$ http.get()?

  8. 8

    Angular服务,带有路由参数的$ http.get()?

  9. 9

    Angular2 Routerlink:添加查询参数

  10. 10

    Angular 2 RouterLink用于选择

  11. 11

    Angular 2 Routerlink在for循环中

  12. 12

    带有参数的 Angular 2 路由充当通配符路由

  13. 13

    使用带有路由的ngUpgrade引导Angular 2 rc.6混合应用程序

  14. 14

    带有路由器出口的Angular2组件通信

  15. 15

    带有附加 url 的 angular2 路由参数

  16. 16

    Angular2 Beta出现异常“路由器没有提供者!(RouterLink->路由器)”

  17. 17

    Angular2 RouterLink通过将斜杠替换为%2F来中断路由

  18. 18

    Angular 2 RouterLink改写了URL?

  19. 19

    在Angular 2中测试routerLink指令

  20. 20

    单击任何[routerLink]时的Angular 2事件

  21. 21

    Angular2主机:{'[routerLink]':'/ foo'}

  22. 22

    Angular 2 RouterLink改写了URL?

  23. 23

    在Angular 2中使用routerLink

  24. 24

    来自Angular2中Object的routerLink

  25. 25

    Angular2 Router 3.0 beta 1(通过Routerlink的子路由失败)

  26. 26

    Angular 2在子节点中添加指向根路由器的routerLink

  27. 27

    Angular2 Router 3.0 beta 1(通过Routerlink的子路由失败)

  28. 28

    带有查询字符串的 Angular 5 路由

  29. 29

    Angular2路由配置(带有两个参数的路由)

热门标签

归档