Removing the fragment identifier from AngularJS urls (# symbol)

Question

Is it possible to remove the # symbol from angular.js URLs?

I still want to be able to use the browser\'s back button, etc, when I change the view and will update th

Answer 1

If you are in .NET stack with MVC with AngularJS, this is what you have to do to remove the '#' from url:

1. Set up your base href in your _Layout page:

2. Then, add following in your angular app config : $locationProvider.html5Mode(true)

3. Above will remove '#' from url but page refresh won't work e.g. if you are in "yoursite.com/about" page refreash will give you a 404. This is because MVC does not know about angular routing and by MVC pattern it will look for a MVC page for 'about' which does not exists in MVC routing path. Workaround for this is to send all MVC page request to a single MVC view and you can do that by adding a route that catches all

url:

routes.MapRoute(
    name: "App",
    url: "{*url}",
    defaults: new {
        controller = "Home", action = "Index"
    }
);