Angular2 without hash in the url
If you use PathLocationStrategy as describe here you can remove the hash in the URL.
But getting rid of 404 error needs some server side tweak. A quick and easy way is to configure your server to load the home page when any URL of the form http://yourhost/*
is requested.
Create a .htaccess file Paste the following Code And Upload on your prod Server.
RewriteEngine On
RewriteBase /
RewriteRule ^index\.html$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.html [L]
If you are using Angular final, the reasons to the hash could be:
RouterModule.forRoot(yourRoutesHere, { useHash: true })
So by removing that could help.
RouterModule.forRoot(yourRoutesHere)
Alternatively if you in your providers (in NgModule) have used:
{provide: LocationStrategy, useClass: HashLocationStrategy}
just remove that.
EDIT, if you need LocationStrategy, try changing HashLocationStrategy
to PathLocationStrategy
:
{provide: LocationStrategy, useClass: PathLocationStrategy}
More about LocationStrategy here
Now that I have seen your routes as well regarding your 404 issue, you could try changing the following
{ path: '**', component: HomeComponent }
to:
{ path: '**', redirectTo: '', pathMatch: 'full' }
More about routing here
Also check that in your index.html
you have set the basehref like so:
<base href="/">