Angular 2+ Route useHash:true and anchor jump same page use hash

Typescript File:

public jumpToSamePage(anchorHash) {
    setTimeout(() => {
      const anchor = document.getElementById(anchorHash);
      if (anchor) {
        anchor.focus();
        anchor.scrollIntoView();
      }
    });
  }

HTML Files:

<a [routerLink] fragment="div1" (click)="jumpToSamePage('div1')">Div1</a>
<a [routerLink] fragment="div2" (click)="jumpToSamePage('div2')">Div2</a>
<a [routerLink] fragment="div3" (click)="jumpToSamePage('div3')">Div3</a>

<section id="div1">Div1
<pre>Enter 20 Times</pre>
</section>

<section id="div2">Div2
<pre>Enter 20 Times</pre>
</section>

<section id="div3">Div3
<pre>Enter 20 Times</pre>
</section>

Share on Google Plus

About Ram Pukar

This is a short description in the author block about the author. You edit it by entering text in the "Biographical Info" field in the user admin panel.