以角度方式滚动到顶部功能,primeng 表不起作用

问题描述 投票:0回答:1

我有以下问题:

我使用 PrimeNG 在 Angular 中实现了一个分页表。我希望切换页面时自动滚动到顶部。

我已经尝试过 window.scroll 和 ViewportScroller,但两者都对滚动行为没有任何影响。

由于我的页面由各种组件组成,我相信它与应该滚动的元素有关。

有没有办法一般找到滚动元素然后将其设置到页面顶部?

app.component.html

<div slot="content" class="w-full">
        <router-outlet></router-outlet>
 </div>

手动搜索.component.ts
该组件在路由器出口内渲染,拉伸内容槽。发出 onPageChange 事件后,我想导航到页面顶部

public onPageChange(event: Observable<any>, type: 'Card' | 'Ticket') {
    event.subscribe((data) => {
      if (type == 'Card') {
        this.cards$.next(data);
      } else {
        this.tickets$.next(data);
      }
    });
  }
angular primeng primeng-datatable
1个回答
0
投票

也许这个问题可以帮助你。

为此,您需要在 RouterModule 配置中启用anchorScrolling

@NgModule({
  declarations: [],
  imports: [
    RouterModule.forRoot(
      appRoutes,
      {
        anchorScrolling: "enabled"
      }
    )
  ],
  exports: [
    RouterModule
  ]
})

然后你需要在你的组件中导入 Router 并使用 Router.navigate 函数并为你想要滚动到的元素定义一个 id

this.router.navigate([], { fragment: 'fragmentIdToScrollTo' })
© www.soinside.com 2019 - 2024. All rights reserved.