removing angular hash and prefix from #anchor

Question

iam strugling to make a direct anchor link to a site. when ever i try to link to the id via: https://www.somesite.com/cl/details/agents#20841
where #20841 is my anchor tag. Angular breaks the url and makes it:
https://www.somesite.com/cl/details/agents#!#20841
this works fine in chrome and firefox, but in internet explorer and edge it dosnt, so it "breaks" the url. Ive tried to change the prefix to "!", instead of "/".

Anyone have a work around for this problem?

from angular 1.5 its made as enable by default use $locationProvider.html5Mode(true/false); — Vinod Louis, Jan 24 '17 at 09:50
trying to set $locationProvider.html5Mode(true); breaks some animation and such in internet explorer 9 — Mathias Rønnow Nørtoft, Jan 24 '17 at 09:54
yeah sorry for not elaborating, in internet explorer 9 it breaks some animations, for some reason. — Mathias Rønnow Nørtoft, Jan 24 '17 at 09:58
may be this can help http://stackoverflow.com/questions/22763599/ie-9-not-supporting-locationprovider-html5mode — Vinod Louis, Jan 24 '17 at 10:00

score 1 · Answer 1 · edited May 23 '17 at 12:24

1

If you are using Angular 1.6, you can remove this prefix by adding this code to your config:

appModule.config(['$locationProvider', function($locationProvider) {
  $locationProvider.hashPrefix('');
  $locationProvider.html5Mode(true);
}]);

Note that it could not be supported in IE9 dues to HTML5 compatibilty.

See this link for more information.

edited May 23 '17 at 12:24

Community

1
1

answered Jan 24 '17 at 10:00

Mistalis

17,793
13
73
97

making it even more annoying, iam not able to use version 1.6, so adding this bit of code just gives me the initial problem with angular routes so the hash becomes #/20841 – Mathias Rønnow Nørtoft Jan 24 '17 at 10:10
if do this $locationProvider.hashPrefix('!'); my anchor becomes #!#20841 if i do this $locationProvider.hashPrefix(''); it falls back to default value and the anchor becomes #/20841 – Mathias Rønnow Nørtoft Jan 24 '17 at 10:13
sorry didnt understand then, i want to remove the #! so i only have a valid anchor. so #!#20481 becomes #20481 – Mathias Rønnow Nørtoft Jan 24 '17 at 10:16
Ok, so also add this line `$locationProvider.html5Mode(true);`. I've updated my answer. – Mistalis Jan 24 '17 at 10:22
as stated in my above comments, i can run html5mode, because it breaks some animations in internet explorer 9 – Mathias Rønnow Nørtoft Jan 24 '17 at 10:26
Does the [first link](http://stackoverflow.com/a/22771095/4927984) I provided helps you? – Mistalis Jan 24 '17 at 10:30
nope, if i go with that solution, i will still have the problem when using internet explorer. with the wrong #!# format – Mathias Rønnow Nørtoft Jan 24 '17 at 10:30

removing angular hash and prefix from #anchor

1 Answers1