AngularJS routing without the hash '#'

ghz 1years ago ⋅ 5133 views

Question

I'm learning AngularJS and there's one thing that really annoys me.

I use $routeProvider to declare routing rules for my application:

$routeProvider.when('/test', {
  controller: TestCtrl,
  templateUrl: 'views/test.html'
})
.otherwise({ redirectTo: '/test' });

but when I navigate to my app in browser I see app/#/test instead of app/test.

So my question is why AngularJS adds this hash # to urls? Is there any possibility to avoid it?

Answer

In fact you need the # (hashtag) for non HTML5 browsers.

Otherwise they will just do an HTTP call to the server at the mentioned href. The # is an old browser shortcircuit which doesn't fire the request, which allows many js frameworks to build their own clientside rerouting on top of that.

You can use $locationProvider.html5Mode(true) to tell angular to use HTML5 strategy if available.

Here the list of browser that support HTML5 strategy: http://caniuse.com/#feat=history

#angularjs