Question

我使用Angular，需要从一页转到另一页并转到锚点。所以我使用代码（您可以在下面看到），现在跳转不正确。这意味着，当我重定向到第二页时，它会滚动到本节的开头，我需要自己滚动才能查看整节。

第二页

ECO_AUTOWORDSELECTION

路由（我需要使用routerLink。不要建议我使用href）

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

@Component({
  selector: 'hero',
  templateUrl: './hero.component.html',
  styleUrls: ['./hero.component.scss']
})


export class HeroComponent implements OnInit {

  constructor(private translate: TranslateService, router: Router) {

    router.events.subscribe(s => {
      if (s instanceof NavigationEnd) {
        const tree = router.parseUrl(router.url);
        if (tree.fragment) {
          document.querySelector("#" + tree.fragment).scrollIntoView(true)}
        }

    });
  }


  ngOnInit() {

  }
}

锚看起来像

<a mat-button [routerLink]="['/']" fragment="anchor">Go to anchor</a>

要查看其工作原理，请转到http://beta-rev.azurewebsites.net，然后单击标题中的Blog->单击Blog标题中的体系结构或出版物，您便可以自己看到此内容

scrollIntoView效果不好

0 个答案: