2016-12-07 114 views
4

我希望有与该URL角2路由器:多个路由参数

/collections/:collectionId/books/:bookId/:title 

例如路由

/collections/10/books/456678/my-book.html 

在我的应用程序,文件routing.module.ts

{path: 'collections/:collectionId/books/:bookId/:title', component: BookDetailsComponent}, 

是可以在不使用嵌套路由器网点?

我试图

this.router.navigate(['/collections',{collectionId: 10, bookId: 456678, title: "my-book.html"}]); 

却得到了这样的错误

Cannot match any routes. URL Segment: 'collections;collectionId=10;bookId=456678;title=my-book.html' 

如果我通过了PARAMATERS作为一个数组,那么

this.router.navigate(['/collections', 10, 456678, "my-book.html"]); 

我得到

Error: Cannot match any routes. URL Segment: 'collections/10/456678/my-book.html 

我设法实现我想要的东西使用“集合”路线下一个“图书”孩子的路线,但我想这样做没有嵌套的路线。

感谢

+0

正是你传递什么作为数组'router.navigate'? – Dimanoid

+0

@Dimanoid:我编辑我的问题表现出更多的代码 – David

+0

你错过了“书”为路径 – Dimanoid

回答

11

应该

this.router.navigate(['/collections', '10', 'books', '456678', "my-book.html"]); 

周围的号码引号不是必要的,但我认为这是很好的做法。

+0

感谢。然而,似乎只有工作,如果我在相应的模板有<路由器outet>,否则我得到的错误无法找到主要出口到装载“BookDetailsComponent” – David

+0

感谢有关逗号的提示。不确定你的意思是与路由器插座。路由器插座始终是强制性的。如果你认为它不应该适合你的情况,那么带有复制品的Plunker将非常​​适合调查。 –

+0

代码(this.router.navigate ...)处于CollectionComponent,其模板不包含路由器的出口。我的路由器插座位于我的AppComponent中。我会尝试创建一个plunker – David