title: Using HTML anchor link #id in Angular 6
body: <p>I am working with an Angular 6 project in which I have disabled/removed hash-location-strategy which removes # from URL.</p>
  <p>due to this change the link having:</p>
  <pre><code>&lt;li routerLinkActive=&quot;active&quot;&gt;
     &lt;a [routerLink]=&quot;['/settings']&quot;&gt;Contact Settings&lt;/a&gt;
     &lt;ul class=&quot;child-link-sub&quot;&gt;
        &lt;li&gt;
           &lt;a href=&quot;#contactTypes&quot;&gt;Contact Types&lt;/a&gt;
        &lt;/li&gt;
     &lt;/ul&gt;
  &lt;/li&gt;
  </code></pre>
  <p>is no more working it just skips the current components URL and puts #contactTypes after localhost.</p>
  <p>I found this <a href="https://github.com/angular/angular/issues/6595" rel="noreferrer">github issue</a> which should solve the issue using</p>
  <pre><code>&lt;a [routerLink]=&quot;['/settings/']&quot; fragment=&quot;contactTypes&quot; &gt;Contact Types&lt;/a&gt;
  </code></pre>
  <p>which puts #contactTypes at the end of the URL but it doesn't scroll to the top of the browser.</p>
  <p>Source: <a href="https://github.com/angular/angular/issues/6595" rel="noreferrer">https://github.com/angular/angular/issues/6595</a></p>