AngularJS 1.4.8 $ locationProvider.html5Mode不能帮助删除哈希

Question

I'm using AngularJS 1.4.8. As it's sayed at the tutorial, I've created routing rules:

alphApp.config(['$routeProvider', '$locationProvider', function ($routeProvider, $locationProvider) {
    $routeProvider
            .when('/', {
                templateUrl: 'pages/home.html',
                controller: 'mainCtrl'
            })
            .when('/alphabet', {
                templateUrl: 'pages/alphabet.html',
                controller: 'alhabetController'
            })
            .otherwise({
                redirectTo: '/'
            });

    $locationProvider.html5Mode({
        enabled: true,
        requireBase: false
    });

}]);

But when I press the link

<a href="#alphabet">

The address bar shows domain/#alphabet and the content remains unchanged till I update the page. After the page update url becomes domain/alphabet with right content. If I remove this part:

$locationProvider.html5Mode({
    enabled: true,
    requireBase: false
});

the url will look like domain/#/alphabet but content will change properly. The issue can be solved by downgrading angular to the 1.2.25 howerwer it causes issue with get-params, so is there a way to have pretty urls without downgrading angular?

Answer 1

Your href is telling the browser to go to oldpath/#alphabet, oldpath/alphabet. You need to change your hrefs to:

href="/alphabet"