How to Remove # from URL in AngularJS?
Hi Folks,
In this quick example, let's see angularjs # delete from url. We will look at an example of remove # from url angularjs. If you have a question about remove hash from url angularjs example then I will give a simple example with a solution. you can see angularjs remove # from route. Alright, letβs dive into the steps.
If you work on AngularJS web application using angular route then you notice one thing. If you click on any hyper links it makes like as bellow:
http://localhost:8000/#
http://localhost:8000/#/items
http://localhost:8000/#/users
I mean always "#" will be there, But when we live this web application then it should delete "#" from URL, because it makes issue when we share link on facebook or etc.
But should look likes:
http://localhost:8000/
http://localhost:8000/items
http://localhost:8000/users
But we can remove easily using "$locationProvider.html5Mode(true);". You can do it like as bellow simple example i did, but make sure you have to first add base tag on your head tag like as bellow:
Your root file
<head>
<base href="/">
....
</head>
Angular JS Route
var app = angular.module('main-App',['ngRoute']);
app.config(['$routeProvider','$locationProvider',
function($routeProvider, $locationProvider) {
$routeProvider.
when('/', {
templateUrl: 'templates/home.html',
controller: 'HomeController'
}).
when('/users', {
templateUrl: 'templates/users.html',
controller: 'UserController'
}).
otherwise({
redirectTo: '/'
});
$locationProvider.html5Mode(true);
}]);