Javascript 启用html5模式下的Angularjs ui路由器不工作

Angularjs版本1.3.14，用户界面路由器版本0.2.15，HTML5模式已启用。当我尝试时，它会重定向到作为回退

这里是app.js

'use strict';

// Declare app level module which depends on views, and components
angular.module('tt', [
  'ngRoute',
  'tt.home',
  'tt.firsttime',
  'ui.router'
])

.config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) {
    // Routes
    $routeProvider.otherwise({
        redirectTo: '/'
    });

    // set HTML5 history API
    $locationProvider.html5Mode(true);
}]);

// create our angular app and inject ngAnimate and ui-router 
// =============================================================================
angular.module('tt.firsttime', ['ui.router'])

// configuring our routes 
// =============================================================================
.config(['$stateProvider', '$urlRouterProvider', '$routeProvider', function($stateProvider, $urlRouterProvider, $routeProvider) {
    // catch all route
    // send users to the form page 
    $urlRouterProvider.otherwise('/firsttime');

    $stateProvider
        // route to show our basic form (/firsttime)
        .state('firsttime', {
            url: '/firsttime',
            templateUrl: 'firsttime/form.html',
            //controller: 'formController'
        })
}])

// our controller for the form
// =============================================================================
.controller('formController', ['$scope', function($scope) {
    console.log('FORM controller');
}]);

这里是firsttime.js

'use strict';

// Declare app level module which depends on views, and components
angular.module('tt', [
  'ngRoute',
  'tt.home',
  'tt.firsttime',
  'ui.router'
])

.config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) {
    // Routes
    $routeProvider.otherwise({
        redirectTo: '/'
    });

    // set HTML5 history API
    $locationProvider.html5Mode(true);
}]);

// create our angular app and inject ngAnimate and ui-router 
// =============================================================================
angular.module('tt.firsttime', ['ui.router'])

// configuring our routes 
// =============================================================================
.config(['$stateProvider', '$urlRouterProvider', '$routeProvider', function($stateProvider, $urlRouterProvider, $routeProvider) {
    // catch all route
    // send users to the form page 
    $urlRouterProvider.otherwise('/firsttime');

    $stateProvider
        // route to show our basic form (/firsttime)
        .state('firsttime', {
            url: '/firsttime',
            templateUrl: 'firsttime/form.html',
            //controller: 'formController'
        })
}])

// our controller for the form
// =============================================================================
.controller('formController', ['$scope', function($scope) {
    console.log('FORM controller');
}]);

这里是form.html

<div class="row">
<div class="col-sm-8 col-sm-offset-2">

  <div id="form-container">

      <div class="page-header text-center">
          <h2>Let's Be Friends</h2>

          <!-- the links to our nested states using relative paths -->
          <!-- add the active class if the state matches our ui-sref -->
          <div id="status-buttons" class="text-center">
              <a ui-sref-active="active" ui-sref="firsttime.profile"><span>1</span> Profile</a>
              <a ui-sref-active="active" ui-sref="firsttime.interests"><span>2</span> Interests</a>
              <a ui-sref-active="active" ui-sref="firsttime.payment"><span>3</span> Payment</a>
          </div>
      </div>

      <!-- use ng-submit to catch the form submission and use our Angular function -->
      <form id="signup-form" ng-submit="processForm()">
          <!-- our nested state views will be injected here -->
          <div id="form-views" ui-view></div>
      </form>

  </div>



</div>
</div>

---

从

app.js

中删除可能与当前路线系统冲突的

config

块。决不能同时使用两个路由引擎。通过查看您的代码，您似乎正在尝试使用

ui路由器

进行路由。因此，删除

app.js

config块可能会解决您的问题

问题是因为这条线

$routeProvider.otherwise({
    redirectTo: '/'
});

从

app.js

中删除代码后，您应该在下面的行中移动到

firsttime.js

config块，这将启用

HTML5模式

// set HTML5 history API
$locationProvider.html5Mode(true);

---

我试过了，运气不好！这与nginx配置有关吗？更新的原始版本post@Dewsworld您需要在nginx端解决的问题。。我我对它不熟悉。。对不起，我认为错误是由于混合了routeprovider和stateprovider造成的。升级到ui路由器，因为它看起来比ngRoute@Dewsworld这就是我在回答中的建议。。您正在使用

ui路由器

删除

ngRoute

东西thoroughly@Dewsworld很高兴帮助你……谢谢：）