Angular Router usehash: navigate is not preserve the url before the hastag

Question

I have the following URL:

https://localhost:4200/example/#/

When I navigate no another angular route like the following example shows, the /example is erased from the URL. The resulting URL is https://localhost:4200/#/firstSegment/secondSegment instead of https://localhost:4200/example/#/firstSegment/secondSegment

...
constructor(private router: Router) {}
....

navigate() {
    this.router.navigate([`/firstSegment/secondSegment`]);
}

There is a way that I could preserve the URL part before the # each time I perform the navigation?

Follows my router config:

@NgModule({
   .....
   imports: [
      .....
      RouterModule.forRoot(
      appRoutes,
      {
        enableTracing: false, // <-- debugging purposes only
        useHash: true,
        initialNavigation: false
      }
     .....
   ]

})

Answer 1

For the default route, you need to set the prefix to angular.json

...
"projects": {
    "app-name": {
      "prefix": "example",
    ...
}
...

More details https://angular.io/guide/workspace-config