Angular.js add #%2F on URL when set $locationProvider.html5Mode(true).hashPrefix('!')

Question

After configure: $locationProvider.html5Mode(true).hashPrefix('!') when i enter url : www.example.com/search on browser(chrome) and press enter then it turn into : www.example.com/#%2Fsearch and then go to home page.

when i click on the link like <a href="/search" /> then its work. if i remove .hashPrefix('!') then also works fine. But i need that hashPrefix('!')

Any idea how could i solve this?

Answer 1

This was happening to me because all my links had a "#" on them, like in www.example.com/search/#/xxx/yyy. When clicked, it would take you to www.example.com/search/#%2Fxxx%2Fyyy. So I just removed them and the problem disappeared.

Answer 2

I know this is an old post and the problem has already been solved. I had the same issue with an application I was working, but, in my case, we should keep the '#'. So, all I did was add the following line:

$locationProvider.html5Mode(false).hashPrefix('');

Don't forget to modify your .config arguments if you haven't done it already, like this:

.config(function($routeProvider, $locationProvider)