Menu
I'm trying to get rid of the hashtag that appears in my ui-router URLs. (http://localhost:3000/email doesn't work but http://localhost:3000/#email works. After scouring SO, I haven't found a case that works for me. I'm running locally for now, so I assume I don't need any "Server configuration" and I included "" in my index.html.
(function(angular) {
'use strict';
angular.module('myApp', ['ui.router'])
.controller('MainController', function($scope, $route, $routeParams, $location) {
$scope.$route = $route;
$scope.$location = $location;
$scope.$routeParams = $routeParams;
})
.config([
['$stateProvider', '$locationProvider', '$urlRouterProvider', function($stateProvider, $urlRouterProvider, $locationProvider, $provide) {
$urlRouterProvider.otherwise('/email');
// PAGES
$stateProvider
.state('email', {
url: '/email',
templateUrl: '../pages/email.html',
controller: 'EmailController'
})
.state('about', {
url: '/about',
templateUrl: '../pages/about.html',
controller: 'AboutController'
})
// ... the rest...
$locationProvider
.html5Mode(true); // enable html5Mode for pushstate ('#'-less URLs DOESN'T WORK)
.hashPrefix('!');
$provide.decorator('$sniffer', function($delegate) {
$delegate.history = false;
return $delegate;
});
}]);
790
You can either do this in your run block:
$locationProvider.html5Mode({
enabled: true,
requireBase: false
});
And your url's will be changed from domain.com/#foo to domain.com/foo (this requires no explicit base).
...or do this in your run block:
$locationProvider.html5Mode(true);
...and then add this to your html <head>:
<base href="/">
This solution provides the same outcome as the first, except that now there is a specified base.
169
Perhaps try this code? I think it may be down to one of these reasons.
<head> tag using <base href='/'> (or maybe '/email' ?)angular.module('myApp', ['ui.router'])
.controller('MainController', function ($scope, $route, $routeParams, $location) {
$scope.$route = $route;
$scope.$location = $location;
$scope.$routeParams = $routeParams;
})
.config(function ($stateProvider, $urlRouterProvider, $locationProvider, $provide) {
$urlRouterProvider.otherwise('/email');
// PAGES
$stateProvider
.state('email', {
url: '/email',
templateUrl: '../pages/email.html',
controller: 'EmailController'
})
.state('about', {
url: '/about',
templateUrl: '../pages/about.html',
controller: 'AboutController'
});
$locationProvider.html5Mode(true).hashPrefix('!');
$provide.decorator('$sniffer', function ($delegate) {
$delegate.history = false;
return $delegate;
});
});
Apologies, I can't get the code sample to behave.
35
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
