Angular 2路由 - 路由器RC3

我试图导航到一个页面后使用routerLink得到一个id，我可以得到。Angular 2路由 - 路由器RC3

问题是链接显示为'/ page; id = 10/component'。我想它显示为 '/页/ 10 /组件'（未矩阵符号 - 没有 'ID ='）

在我app.routes.ts：

@RouterConfig = [ 
    { path: 'page/:id/component', component: MyComponent, data: {id: 'item.id'} } 
];

在我的网页：

<a [routerLink]="['page', {id: item.id}, 'component']">

我正在使用最新的Angular 2路由器组件（RC3 Beta 2）。

任何人都知道我在做什么错了？提前致谢。

2016-07-15 Netwraith

这应该是：

<a [routerLink]="['page', {'id': item.id}, 'component']">

代替：

<a [routerLink]="['/page', item.id, 'component']">

2016-07-15 16:34:51 Yhlas

谢谢。我尝试过，但仍然得到相同的东西... – Netwraith

我在我正在做的应用程序中做同样的事情。也许你在其他地方有错误。确保你的组件指令列表中有ROUTER_DIRECTIVES。 – Yhlas

奇怪。我的指令列表中也有路由器指令。 – Netwraith

试试这个

<a [routerLink]="['page', item?.id, 'component']">

2016-07-15 18:07:17

谢谢。试了一下，但得到'无法读取属性'toString的'未定义'的错误，可能是指'项目'。我通过服务获取项目，并在页面的其他位置显示另一个属性。 – Netwraith

尝试添加elvis操作符，建议在我更新的答案 –

嗯，试过，仍然没有运气：同样的错误 – Netwraith

从我所看到的，该路由配置不起作用：

{ path: 'page/:id/component', component: MyComponent, data: {id: 'item.id'} }

我认为你真正需要问的是如果最终'/component'是必要的。如果是这样，您可能需要考虑添加一个child route。

另一种选择是改变路线顺序，改为使用page/component/:id。我相信routerlink指令将你的URL搜索参数附加到路由的末尾，所以这应该起作用。

同样，最简单的解决方案是从路由配置中删除'/component'。

2016-08-05 14:11:13

回答