我正在尝试导航到提供两个路由参数的页面,如下所示:
author/journals/:journal_Id/draftArticles/:articleId
我知道当路由参数位于路由末尾时可以给出两个参数author/journals/draftArticles/:journal_Id/:articleId, journal_Id, articleId
,这可能会解决我的问题。但我想保持我正在尝试的结构。
path: 'author',
canActivate: [AuthGuardService],
canActivateChild: [AuthorGuard],
component: AuthorNavComponent,
children: [
{
path: '',
component: AuthorDashboardComponent,
pathMatch: 'full'
},
{
path: 'profile',
component: AuthorProfileComponent,
pathMatch: 'full'
},
{
path: 'journals/:journal_Id',
component: JournalPublicPageComponent,
pathMatch: 'full',
children: [
{
path: 'draftArticles', children: [
{
path: ':articleId',
component: DraftArticleComponent,
pathMatch: 'full'
},
{
path: '',
component: DraftArticlesComponent,
pathMatch: 'full'
}
]
},
{
path: 'articles', children: [
{
path: '',
component: ArticlesComponent,
pathMatch: 'full'
},
{
path: ':articleId',
component: ArticleComponent,
pathMatch: 'full'
}
]
}
]
}
以上是我的路线的结构。
AuthorNavComponent
是我的 Sidenav,在其中我还使用另一个路由器插座来显示儿童路线。我单击的按钮位于 Sidenav 内部,它最终调用 serviceA 中的一个方法,该方法在调用服务器后将重定向到上述指定的 URL,即https://localhost:4200/author/journals/:journal_Id/draftArticles /:文章ID
如果需要更多信息,请告诉我
更新
我尝试使用中间命名的服务journalService
并创建了一个BehaviorSubject<any[]>
以传递导航到的路径。在路由为 的组件中author/journals/3
,我订阅了它BehaviorSubject<any[]>
并在更改此 BehaviorSubject 的值时进行导航,该 BehaviorSubject 沿相对 ActivatedRoute 传递,如下所示:
日记帐组件
this.js.navigateAgain.subscribe(data => {
if (data) {
this.router.navigate(data, {relativeTo: this.activatedRoute});
}
});
其他组件我要更改的值BehaviorSubject<any[]>
this.js.navigateAgain.next(['draftArticles', articleId]);
也可以使用此生成更新 2this.router.navigate(['author/journals', journalId, 'draftArticles', articleId]);
路线 ->但仍然存在以下错误:(
上述技术完美地生成了 URL。但我仍然收到以下错误:
看起来,上面描述的路由有问题。