angularJS中的狀態提供者和路由提供者

Question

下面是我的app.js文件

angular
  .module('repoApp', [
    'ngAnimate',
    'ngAria',
    'ngCookies',
    'ngMessages',
    'ngResource',
    'ngRoute',
    'ngSanitize',
    'ngTouch',
    'ui.bootstrap',
    'ui.router'
  ])
  .config(function ($routeProvider) {
    $routeProvider
      .when('/', {
        templateUrl: 'views/main.html',
        controller: 'MainCtrl'
      })
      .when('/about', {
        templateUrl: 'views/about.html',
        controller: 'AboutCtrl'
      })
      .when('/login', {
        templateUrl: 'views/loginPage.html',
        controller: 'loginCtrl'
      })
      .otherwise({
        redirectTo: '/'
      });
  });
angular
  .module('loginState',['ui.router']);

以下是我的州檔案

angular
  .module('repoApp')
  .config(function ($stateProvider) {

      $stateProvider.state('home1', {
        url:'/home1',
        templateUrl: 'views/modals/test.html'
      })
      .state('secondState',{
        url:'/secondState',
        templateUrl: 'views/modals/secondStateTest.html'
      });
  });

問題是，使用我的html導航到登錄頁面。

<ul class="nav navbar-nav">
              <li class="active"><a href="#/">Home</a></li>
              <li><a ng-href="#/about">About</a></li>
              <li><a ng-href="#/">Contact</a></li>
              <li class="loginShift"><a ng-href="#/login">Login</a></li>
            </ul>

但是我試圖在我的流程擊中控制器后立即進入狀態

angular.module('repoApp')
  .controller('loginCtrl', function ($scope,$modal,$state) {
    $scope.awesomeThings = [
      'HTML5 Boilerplate',
      'AngularJS',
      'Karma'
    ];
    $state.go('home1');
    $scope.openDialog = function () {
        $modal.open({
          keyboard: 'static',
          templateUrl: 'views/login/loginCred.html',
        });
      };        
  });

但我無法進入家鄉狀態。 如果我改變我的狀態文件即

$stateProvider.state('home1', {
            url:'/login',
            templateUrl: 'views/modals/test.html'
          })

在這里我改變了URL。 它現在工作正常。

我有一個模板，我想導航到下一個狀態

<div>
<button data-ng-click="openDialog()">open ME!</button>
<div><a ui-sref="secondState">click here</a></div>
</div

但是一旦我點擊這個錨標簽，它就會導航我回到主頁。 即不到我打算去的州。 主要問題是URL（我猜）任何幫助將不勝感激。

Answer 1

您不應該同時使用ngRoute和UI-router 。 這是UI路由器的示例代碼：

 repoApp.config(function($stateProvider, $urlRouterProvider) { $stateProvider .state('state1', { url: "/state1", templateUrl: "partials/state1.html", controller: 'YourCtrl' }) .state('state2', { url: "/state2", templateUrl: "partials/state2.html", controller: 'YourOtherCtrl' }); $urlRouterProvider.otherwise("/state1"); }); //etc. 

你可以在這個帖子中找到關於這兩者之間差異的一個很好的答案： angular-route和angular-ui-router之間有什么區別？

您還可以在此處查閱UI-Router的文檔： https ： //github.com/angular-ui/ui-router