Javascript 为什么启用HTML5模式时AngularJS路由会中断？_Javascript_Angularjs_Html_Url Routing_Angular Routing

Javascript 为什么启用HTML5模式时AngularJS路由会中断？

javascript angularjs html

Javascript 为什么启用HTML5模式时AngularJS路由会中断？,javascript,angularjs,html,url-routing,angular-routing,Javascript,Angularjs,Html,Url Routing,Angular Routing,我想使用AngularJS路由。我使用AngularJS seed master作为起点，默认情况下路由工作。然而，在我启用HTML5模式后，它停止了工作。下面是路由工作时的html代码 <ul class="menu"> <li><a href="#/view1">view1</a></li> <li><a href="#/view2">view2</a></li>

我想使用AngularJS路由。我使用AngularJS seed master作为起点，默认情况下路由工作。然而，在我启用HTML5模式后，它停止了工作。下面是路由工作时的html代码

  <ul class="menu">
    <li><a href="#/view1">view1</a></li>
    <li><a href="#/view2">view2</a></li>
  </ul>    
  <div ng-view></div>
  <script src="lib/angular/angular.min.js"></script>
  <script src="lib/angular/angular-route.min.js"></script>
  <script src="js/app.js"></script>
  <script src="js/services.js"></script>
  <script src="js/controllers.js"></script>
  <script src="js/filters.js"></script>
  <script src="js/directives.js"></script>

angular.module('myApp', [
  'ngRoute',
  'myApp.filters',
  'myApp.services',
  'myApp.directives',  
  'myApp.controllers'
]).
config(['$routeProvider', function($routeProvider) 
{
    //configuration for $routeProvider
    $routeProvider.when('/view1', {templateUrl: 'partials/partial1.html', controller: 'MyCtrl1'});
    $routeProvider.when('/view2', {templateUrl: 'partials/partial2.html', controller: 'MyCtrl2'});
    $routeProvider.otherwise({redirectTo: '/view1'});

}])

然后，我通过将其添加到app.js中启用了HTML5模式

.config(['$locationProvider', function($locationProvider)
{        
    $locationProvider.html5Mode(true);
}])

正是在这一点上，AngularJS路由停止工作。我做错了什么？启用HTML5模式后，如何使AngularJS路由正常工作

您需要做的是在“app.js”中将“HTML5模式”设置为true：

在index.html中，在标题下添加：

<head>
      <base href="/" />
      <meta name="fragment" content="!">
</head>

并更改链接：

<body>
  <ul class="menu">
    <li><a href="/#!/view1">view1</a></li>
    <li><a href="/#!/view2">view2</a></li>
  </ul>
</body>

这就是主URL：

将重定向到：

链接将显示性感的地址。

可能重复

<body>
  <ul class="menu">
    <li><a href="/#!/view1">view1</a></li>
    <li><a href="/#!/view2">view2</a></li>
  </ul>
</body>