小编MPP*_*MPP的帖子

导航到 Angular 中**不同**(不相同)页面/组件的片段

单击链接时,我想导航到不同页面/组件的片段。即使尝试了多种方法,我也无法实现这一目标:

关联:

<a routerLink="/main/dash" fragment="dir">View</a>
Run Code Online (Sandbox Code Playgroud)

目标 html/模板:

<!-- Other elements -->

<app-dir id="dir"></app-dir>
Run Code Online (Sandbox Code Playgroud)

路由器配置:

{
   path: 'main',
   component: LayoutComponent,
   children: [{
      path: 'dash',
         loadChildren: () => import('src/app/features/dash/dash.module').then(m => m.DashModule),
         canActivate: [AuthGuard]
   }]

   // Other code
}
   
// Other code

imports: [RouterModule.forRoot(appRoutes, { useHash: true, anchorScrolling: 'enabled', onSameUrlNavigation: 'reload' })],
Run Code Online (Sandbox Code Playgroud)

单击“查看”链接时,系统导航到/main/dash路径/页面/组件,但在第一次运行时不会滚动到片段。进入主页后,当我单击相同的导航链接(视图 - 位于标题中)时,它会滚动到片段。

即当我已经在同一个页面/组件上时,AnchorScrolling 工作,但如果源是不同的页面/组件,则不起作用。

我也尝试使用(click)&this.router.navigate()而不是使用 routerLink - 但结果是一样的。

我确实使用HashLocationStrategy.

任何帮助,将不胜感激。

谢谢!

更新:

在深入挖掘之后,页面加载 Angular 后的片段路由是我面临的确切问题。似乎还没有可用的解决方案?:https : //github.com/angular/angular/issues/30139

page-fragments angular-routing anchor-scroll angular hash-location-strategy

5
推荐指数
1
解决办法
880
查看次数