Angular 2 - Remove Hash (#) from the URL

Question

I am loading the modules by loadChildren("123#childModule") from appModule and it is always appending /#/ in the browser.

I have tried useHash : false as well as Providers as PathLocationStrategy, but I still see the issue.

Been doing research on this but I did not find any solution so far. Any idea? Thanks in advance.

Add your app.routing.ts module contents here – Daniel Sep 16 '17 at 17:14 — Daniel, Sep 16 '17 at 17:14
https://stackoverflow.com/a/46315140/2978923 – prabhatojha Sep 20 '17 at 07:09 — prabhatojha, Sep 20 '17 at 07:09

score 1 · Accepted Answer · answered Sep 16 '17 at 17:07

You may try for this:

If you are using Angular final, the reasons to the hash could be:

RouterModule.forRoot(yourRoutesHere, { useHash: true })

or Use this:

Beside the module providers, check your module imports, it can also be overridden by providing the { useHash: true } as the second argument of the RouterModule.forRoot:

imports: [
    ...
    RouterModule.forRoot(routes, { useHash: true })  // remove second argument
]

score 0 · Answer 2 · answered Aug 18 '17 at 06:51

0

First of all, I believe you were trying lazyloading with module The routes code should be like this :

{ path: 'mgt', loadChildren: 'app/your-mgt/your-mgt.module#YourModule'}

And the # shows on your url have nothing to do with the "#" here .
By default , Angular used PathLocationStrategy already

RouterModule.forRoot(routes)

I guess this is yours :

RouterModule.forRoot(routes, { useHash: true } or RouterModule.forRoot(routes, { useHash: false }

Not sure whats your backend is , but if you have one , and it will use ajax to fetch data . If you are using Express in your backend . Try this

answered Aug 18 '17 at 06:51

Joe Lee

49
4

1

Hi Lee, Thanks for your response. we are seeing the /#/ in the url on just loading the static page itself with no service calls. tried useHash: false but still no luck. we are not sure what exactly is adding # in the url. i am pretty new to angular 2, please help. – Raju Ch Aug 21 '17 at 17:34
I figured out where it is going wrong, the custom libraries that we made are using Hashlocation strategy. thanks for your support and help. – Raju Ch Aug 25 '17 at 16:32

score 0 · Answer 3 · edited Aug 13 '21 at 06:52

0

You can try this :

RouterModule.forRoot(appRoutes, {useHash:false} );

Or remove useHash :

RouterModule.forRoot( appRoutes );

edited Aug 13 '21 at 06:52

slim

447
2
10
27

answered Sep 25 '19 at 11:57

suganya

21
4

Angular 2 - Remove Hash (#) from the URL

3 Answers3