从angularjs中删除#并使url变得漂亮


Removing # from angularjs and making url pretty

我想从url 中删除#

我已经使用了locationProvider,并在index.html 中

Locationprovider被指定为

scotchApp.config(function($routeProvider, $locationProvider) {
..
$locationProvider.html5Mode(true);

这是我的脚本.js

// create the module and name it scotchApp
var scotchApp = angular.module('scotchApp', ['ngRoute']);
// configure our routes
scotchApp.config(function($routeProvider, $locationProvider) {
    $routeProvider
    // route for the home page
    .when('/', {
        templateUrl : 'pages/home.html',
        controller  : 'mainController'
    })
    // route for the about page
    .when('/about', {
        templateUrl : 'pages/about.html',
        controller  : 'aboutController'
    })
    // route for the contact page
    .when('/contact', {
        templateUrl : 'pages/contact.html',
        controller  : 'contactController'
    });
        $locationProvider.html5Mode(true);
});
// create the controller and inject Angular's $scope
scotchApp.controller('mainController', function($scope) {
    // create a message to display in our view
    $scope.message = 'Everyone come and see how good I look!';
});
scotchApp.controller('aboutController', function($scope) {
    $scope.message = 'Look! I am an about page.';
});
scotchApp.controller('contactController', function($scope) {
    $scope.message = 'Contact us! JK. This is just a demo.';
});

这是这个问题的后续行动。我仍然没有得到解决方案。如果答案是肯定的,我会接受这两个答案。

这是我想做的一个例子。

注:

This is my project folder
localhost/test/angular

所以,我有这个链接在关于

localhost/test/angular/about

请求:请从plunkr下载源代码并尝试一下。

我没有得到任何错误,但没有出现在正文部分

感谢

要使用相对链接链接应用程序,您需要在文档的头部设置此html代码。

<base href="/your-base-if-needed"> 

<base href="/">

但是HTML5模式设置为true应该会自动解析相对链接