为延迟加载的模块组件指定routerLink?

时间:2019-11-19 06:34:33

标签: javascript html angular typescript

在此演示应用程序中,我在延迟加载的图书模块中具有以下路线:

{ path: 'collection', component: CollectionPageComponent },

在搜索组件中,还有以下路由器链接:

  <a routerLink="collection">Collections</a>

将鼠标悬停在链接上时,将显示路径books/collection。但是,单击它会转到404页。有想法吗?

https://stackblitz.com/edit/angular-temp-slice-demo-phase2?file=src%2Fapp%2Fbooks%2Findex.ts

1 个答案:

答案 0 :(得分:4)

路线

{ path: ':id', component: ViewBookComponent, resolve: { book: BookResolverService }}

正在使用您的字符串collection作为id的输入。

要解决此问题,

将特定路线放置到顶部,即

{ path: 'collection', component: CollectionPageComponent },
{ path: ':id', component: ViewBookComponent, resolve: { book: BookResolverService }}