Question

我有两个HTML页面。一个是exam.html，另一个是result.html。在exam.html的控制器ExamCtrl中的某些情况下，我使用result.html路由到$location.path。但是，在result页面上，虽然我已将配置文件添加到配置文件中，但控制器ResultCtrl似乎无法加载。

angular config file：

angular.module('exam').config(['$stateProvider',
  function ($stateProvider) {
    // Exam state routing
    $stateProvider
      .state('exam', {
        abstract: true,
        url: '/exam',
        template: '<ui-view/>'
      })
      .state('exam.list', {
        url: '',
        templateUrl: 'modules/exam/client/views/exam.client.view.html',
        controller: 'ExamCtrl'
      })
      .state('/result', {
        url: '/result',
        templateUrl: 'modules/exam/client/views/exam-result.client.view.html',
        contoller: 'ResultCtrl'
      });
  }
]);

ExamCtrl：

angular
.module('exam')
.controller('ExamCtrl', ['$scope', '$stateParams', '$location', 'Authentication', '$http',
  function ($scope, $stateParams, $location, Authentication, $http) {


$scope.submitAnswer = function (selected) {         
      //some code
      if (qtnCounter > 5) {
        // loads the result page.
        $location.path('/result');
      } else {
        $scope.getQues();
      }
    };
  }
]);

ResultCtrl：

angular
.module('exam')
.controller('ResultCtrl', ['$scope', '$stateParams', '$location', 'Authentication', '$http',
  function ($scope, $stateParams, $location, Authentication, $http) {

    console.log('ResultCtrl');

   }
]);

result.html：

<body ng-controller="ResultCtrl">
    <h1>Result page!</h1>   
</body>

Answer 1

使用$location时遗忘使用$state更改为应用中的指定状态。

在控制器中注入$state，然后调用将加载视图并设置控制器的transitionTo()

angular
.module('exam')
.controller('ExamCtrl', ['$scope', '$state', 'Authentication', '$http',
  function ($scope, $state, Authentication, $http) {


$scope.submitAnswer = function (selected) {         
      //some code
      if (qtnCounter > 5) {
        // loads the result page.
        $state.transitionTo('/result');
      } else {
        $scope.getQues();
      }
    };
  }
]);

AngularJS使用不同的控制器路由到不同的页面

1 个答案: