1

There are dozens of questions like this that relate to versions of Angular other than 9. Since the fix seems straightforward and I believe I have implemented it I am wondering if it has changed in v9.

index.html

<head>
    <base href="/">

app-routing.module.ts

imports: [RouterModule.forRoot(routes, { anchorScrolling: 'enabled', useHash: false })],

component.html

<a [routerLink]="['/home']" fragment="clients" data-target="#clients"><i class="bx bx-file-blank"></i> <span> Clients</span></a>

URL shown in the browser:

https://localhost:5001/home#clients

Angular version: 9.1.1

C.OG
  • 6,236
  • 3
  • 20
  • 38

1 Answers1

0

You have set the link explicitly to do that by setting the fragment directive.

If you want to navigate to #clients but not have it show in the URL. Use skipLocationChange:

<a [routerLink]="['/home']" fragment="clients" skipLocationChange data-target="#clients"><i class="bx bx-file-blank"></i> <span> Clients</span></a>

If you want the link to go to /home/clients. Remove the fragment directive:

<a [routerLink]="['/home']" data-target="#clients"><i class="bx bx-file-blank"></i> <span> Clients</span></a>

https://angular.io/api/router/RouterLink

C.OG
  • 6,236
  • 3
  • 20
  • 38
  • Works, thank you! `skipLocationChange ` : not found on angular.io/docs, but appears in v2.angular.io. Is it deprecated? –  Apr 29 '20 at 20:24
  • Hey @Sam it can be found in the docs for [router link directive](https://angular.io/api/router/RouterLink) – C.OG Apr 29 '20 at 20:59