angular - 如何将 Router.navigate() 与命名的路由器导出和 url 参数一起使用

Question

我在使用命名路由器 socket 时遇到了麻烦，虽然我认为我遵循了 angular 文档，但我认为我使用它是错误的:

路由器配置:

const routes: Routes = [

    {path: 'checktypes', component: ChecktypeComponent},
    {path: 'checktypes/:id', component: ChecktypeDetailsComponent, outlet: 'checktypeDetails'},

  ];

ChecktypeComponent 模板:

...
<router-outlet name="checktypeDetails"></router-outlet>
...

在 ChecktypeComponent (在路线 /checktypes 上):

this.router.navigate([{outlets: {checktypeDetails: ['checktypes', 1]}}]);

为了简单起见，我对 id 1 进行了硬编码。我总是收到错误 Cannot match any routes. URL Segment: 'checktypes/1' .我尝试了很多东西，但我无法让它工作。我究竟做错了什么？

Answer 1

您可以使用如下

对于像这样的路线

{
 path: 'update-book/:book-id',
 component: BookUpdateComponent,
 outlet: 'bookPopup' 
}

您可以导航为

this.router.navigate([{ outlets: { bookPopup: [ 'update-book', book.id ] }}]);

这样你就可以将参数传递给 URL 并且 URL 变成了

http://localhost:4200/book(bookList:book-detail//bookPopup:add-book)