AngularJS How to remove # symbol in IE9 by using route

Question

I can't remove the # symbol in IE9. I searched for an answer but didn't find a fix.

This always redirects to

http://myhost.com:8080/#/website/

and shows this description:

The requested resource is not available.

locationprovider.html5mode(true) is not working. The same route is working in FireFox and shows

http://myhost.com:8080/website/

How can I rectify this?

Mephitis

Hi there, did you resolve this issue? I'm having the exact same problem. – Cecrops

@TheLastBlackCat also looking for a solution to this. – Blau

Answer 1

IE9 does not have html5 history api support, that's why it's appending # to the url, removing # will not solve your problem

Nambypamby

thanks for answer. How can i resolve this Problem? Inserting /#/into /path/ in when is not working too... :( – Mephitis

@TheLastBlackCat I would use only # on your place. Switch off html5 mode :) – Nambypamby

Answer 2

$location Documentation

See "Hashbang and HTML5 modes"

Basically, html5 mode uses History API when the browser supports it, and falls back to hashbang(#) when it is not supported.

You cannot "just" remove "#" in a browser without History API. Because when you change the url, the browser would then try to force a reload, breaking the flow.

Schellens

Answer 3

In fact we can not remove that, but we can make it work smoothly

RouterModule.forRoot(ROUTES, { useHash: Boolean(history.pushState) === false });

Pitchblack

Answer 4

Using window.location.hash = '/' solved my problem.

if (window.history && window.history.pushState) {
  $locationProvider.html5Mode(true);
}
else {
        window.location.hash = '/'  // IE 9 FIX            
        $locationProvider.html5Mode(true);
}

Ramires

In fact, angular can treat it in the right way if the browser don't support hte History API, "If the HTML5 History API is not supported by a browser, the $location service will fall back to using the hashbang URLs automatically." $location api – Apicella