$ stateChangeSuccess,总是与$ state.params的值相同

时间:2016-04-07 14:45:45

标签: angularjs angular-ui-router

我无法解决这个问题,我真的在与ui-route以及$stateChangeSuccess$watch挣扎,遇到了两个问题。我试图更改参数的值,当我更改state时,点击一个网址。我认为知道我使用子状态是很重要的。使用我当前的设置,我得到$stateChangeSuccess在加载时触发两次,这意味着它立即设置了值。我试图做的只是改变网址。

我的路线看起来像这样,我试图设置参数的值

.state('medications', {
                url: '/medications',
                templateUrl: '/partials/home.html',
                controller: 'mainController',
                params: { showSection: false },
                resolve: {
                    postPromise: ['medicationservice', function(medicationservice) {
                        return medicationservice.getAll();
                    }]
                }
            })
            .state('medications.add', {
                url: '/add',
                templateUrl: '/partials/home.html',
                controller: 'mainController',
                params: { showSection: true },
            })

在我的控制器中,我得到了以下内容,我在openSesame上明确地将false参数设置为init,但如上所述,它会触发并将其设置为true

mainModule.controller('mainController', [
        '$scope',
        '$state',
        '$rootScope',
        'medicationservice',
        function($scope, $state, $rootScope, medicationservice) {
            $scope.medication = {};
            $scope.medications = medicationservice.posts;
            $scope.openSesame = false;

            $rootScope.$on("$stateChangeSuccess", function() {
                $scope.openSesame = true;
                console.log($scope.openSesame);
            });
}]);

try-catch (with resources)状态更改有效,即如果我使用$rootScope

2 个答案:

答案 0 :(得分:1)

$ stateChangeSuccess的回调,你可以访问fromState,fromState。或者检查当前状态名称

$rootScope.$on("$stateChangeSuccess", function() {
          if ($state.current.name == "medications.add") {

             $scope.openSesame = true;
          } 

          console.log($scope.openSesame);
});

答案 1 :(得分:1)

您可以在$stateChangeSuccess $injecting之前使用$rootScope。您可以在$scope对象上设置侦听器。请查看以下plunker

修改后的代码:

(function() {
  var app = angular.module('myApp', ['ui.router']);
  app.controller('mainController', [
    '$scope',
    '$state',
    function($scope, $state) {
      $scope.medication = {};
      $scope.openSesame = false;

      $scope.$on('$stateChangeSuccess',function(event, toState){
        $scope.openSesame = toState.params.showSection;
      });

      $scope.triggerMe = function() {
        alert('yes');
      };
    }
  ]);

  app.config([
    '$stateProvider',
    '$urlRouterProvider',
    function($stateProvider, $urlRouterProvider) {

      $stateProvider
        .state('medications', {
          url: '/medications',
          template: '<div>{{openSesame}}</div>',
          controller: 'mainController',
          params: {
            showSection: false
          }
        })
        .state('medications.add', {
          url: '/add',
          template: '<div>{{openSesame}}</div>',
          controller: 'mainController',
          params: {
            showSection: true
          },
        });

      $urlRouterProvider.otherwise('medications');
    }
  ]);
}());

点击按钮medicationmedication add以查看值更改。