how to remove '#' from url in angularjs
Question
My url: eDemo/admin/test/list/#/list
I want: eDemo/admin/test/list
js:
var serviceBase ="http://admin-pc/eDemo/admin/test/";
function config($routeProvider, $locationProvider) {
$routeProvider
.when('/add', {
controller: 'addController',
templateUrl: serviceBase + 'add',
controllerAs: 'vm',
})
.when('/edit', {
controller: 'editController',
templateUrl: serviceBase + 'edit',
controllerAs: 'vm',
})
.otherwise({ redirectTo : 'list' });
}
html:
<div class='ng-view'></div>
3 answers
solution1
2 2016-03-09 07:49:32
You just need to add html5Mode(true) in your route provider configuration. Make sure that you are passing the parameter $locationProvider on config function as an argument.
here us the sample js code:
var serviceBase ="http://admin-pc/eDemo/admin/test/";
app.config(['$routeProvider','$locationProvider',
function ($routeProvider,$locationProvider) {
$routeProvider
.when('/add', {
controller: 'addController',
templateUrl: serviceBase + 'add',
controllerAs: 'vm',
})
.when('/edit', {
controller: 'editController',
templateUrl: serviceBase + 'edit',
controllerAs: 'vm',
})
.otherwise({ redirectTo : 'list' });
$locationProvider.html5Mode(true);
}
And your HTML should looks like below :
<div class='ng-view'>
<base href="<?=url('/').'/'?>">
</div>
Also Keep in mind that never pass # in anykind of url like you redirecting , you submitting form through AJAX or anywhere.
solution2
1 2016-03-09 07:39:19
At the End of route use:
$locationProvider.html5Mode(true);
This should be:
var serviceBase ="http://admin-pc/eDemo/admin/test/";
function config($routeProvider, $locationProvider) {
$routeProvider
.when('/add', {
controller: 'addController',
templateUrl: serviceBase + 'add',
controllerAs: 'vm',
})
.when('/edit', {
controller: 'editController',
templateUrl: serviceBase + 'edit',
controllerAs: 'vm',
})
$locationProvider.html5Mode(true);
}
In View File:
<head>
<meta charset="utf-8">
<base href="/">
</head>
solution3
1 2016-03-09 08:08:44
you can use the $locationProvider like this
$locationProvider.html5Mode({
enabled: true,
requireBase: false
});
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.