设置浏览器反向角度导航的URL片段

好吧,幸运的是,在新的角度6.1中有一个路由器的新功能,你可以启用,你的路由器将“记住”你的最后滚动位置时,你回击。
您必须像这样设置路由器模块:

RouterModule.forRoot(routes, {
    scrollPositionRestoration: 'enabled'
  })

现在的问题是它是一个非常新的特性,而且它只适用于静态页面。这意味着,如果您从服务或其他东西获取内容,恢复将尝试在您实际拥有数据之前将其设置为自己,因此该位置将失败。(目前,即使使用解析器,它也会失败)

我们现在可以通过名为 视图端口滚动条 从 @angular/router package ,但你必须手工操作。(目前,它可能会在不久的将来得到修复)。

export class PendingRacesComponent {
  scrollPosition: [number, number];
  races: Array<RaceModel>;

  constructor(route: ActivatedRoute, private router: Router, private viewportScroller: ViewportScroller) {
    this.races = route.snapshot.data['races'];
    this.router.events.pipe(
      filter(e => e instanceof Scroll)
    ).subscribe(e => {
      if ((e as Scroll).position) {
        this.scrollPosition = (e as Scroll).position;
      } else {
        this.scrollPosition = [0, 0];
      }
    });
  }
  ngAfterViewInit() {
    this.viewportScroller.scrollToPosition(this.scrollPosition);
  }
}

这是一个如何使用它的例子,为了得到完整的解释,您应该访问 post