路由器链接更改时,Angular6移至顶部

时间:2018-10-03 05:22:39

标签: angular

当路由器链接更改时,我尝试转到顶部。 因此我在 Angular6.15 中使用了scrollPositionRestoration,但是它不起作用。

app-routing.module.ts。 ....

imports: [RouterModule.forRoot(routes, {
    scrollPositionRestoration: 'top'
  })],

如何解决此问题? 谢谢。

2 个答案:

答案 0 :(得分:0)

您可以在根模块中执行此操作

import { Router, NavigationEnd } from '@angular/router';

ngOnInit() {
   this.routerEvents();
}

routerEvents(): void {
    this.router.events.subscribe((evt) => {
        if (!(evt instanceof NavigationEnd)) {
            return;
        }
        //!-Scroll Fix
        window.scrollTo(0, 0);
    });
}

所以这是在订阅路由器,并且每次导航时它都会滚动回到顶部

答案 1 :(得分:0)

在组件的.ts中,您可以使用window.scrollTo

pricing = {'A': 20, 'B': 15, 'C', 10}
availability = {'A': 300, 'B': 500, 'C', 200}
trulyFinal = 0
for section in pricing:
    while True:
        try:
            seats = int(input("lease enter how many seats you sold is section %s:" % section))
            if 1 <= seats <= availability[section]:
                trulyFinal += pricing[section] * seats
                break
            raise RuntimeError()
        except (ValueError, RuntimeError):
            print("Please enter a valid number from 1 to %d." % availability[section])

print ("Congratulations, here is your total revenue from tickets: $", trulyFinal)

在组件的.HTML中

您可以添加的组件的.ts中

  scrolltop(){
    window.scrollTo(0, 0);
  }