Question

UPDATE ：我添加了一个控制台语句，似乎这个侦听器处理程序为这一个事件调用了50次。或者可以说这个事件发射了50次。知道为什么吗？可以做些什么？

FIX UPDATE ：

angular.module("main.loadbalancer").run(function($rootScope, $state, DeviceVal){
  $rootScope.$on('$stateChangeStart', function(event, toState){
    if (DeviceVal.readonly && toState.name == "main.loadbalancer.vips") {
        event.preventDefault();
        $state.transitionTo("main.loadbalancer.readonly",  {id: "534584"});
        console.log(toState);
    }
  });
});

每当$state.transitionTo("main.loadbalancer.readonly");运行时，我都会得到UI Router: RangeError: Maximum call stack size exceeded。不知道在哪里或做什么。

angular.module("main.loadbalancer").run(function($rootScope, $state, DeviceVal){
  $rootScope.$on('$stateChangeStart', function(event){
    if (DeviceVal.readonly) {
        $state.transitionTo("main.loadbalancer.readonly");
        event.preventDefault();
        return false;
    }
  });
});

angular.module("main.loadbalancer", ["ui.bootstrap", "ui.router"]).config(function($stateProvider) {
  return $stateProvider.state("main.loadbalancer", {
    resolve: {
      waitForDeviceId: function($state, $q, $timeout, DeviceVal) {
        var deferred = $q.defer();
        $timeout(function() {
          if (DeviceVal.lb) {
            deferred.resolve();
          } else {
            deferred.reject();
          }
        }, 1000);
        return deferred.promise;
      }
    },
    url: "device/:id",
    views: {
      "content@": {
        templateUrl: "loadbalancer/loadbalancer.html",
        controller: "LoadBalancerCtrl"
      }
    }
  }).state("main.loadbalancer.vips", {
    url: "/vips",
    templateUrl: "loadbalancer/vip-table.html",
    controller: "VipListCtrl"
  }).state("main.loadbalancer.nodes", {
    url: "/nodes",
    templateUrl: "loadbalancer/node-table.html",
    controller: "NodeListCtrl"
  }).state("main.loadbalancer.admin", {
    url: "/admin",
    templateUrl: "loadbalancer/admin.html",
    controller: "AdminCtrl"
  }).state("main.loadbalancer.readonly", {
    url: "/readonly",
    templateUrl: "loadbalancer/readonly.html"
  });
});

RangeError: Maximum call stack size exceeded
    at http://10.14.213.161:9000/bower_components/angular/angular.js:7004:18
    at Scope.$broadcast (http://10.14.213.161:9000/bower_components/angular/angular.js:12456:15)
    at Object.transitionTo (http://10.14.213.161:9000/bower_components/angular-ui-router/release/angular-ui-router.js:2032:26)
    at http://10.14.213.161:9000/loadbalancer/services/readonly.service.js:4:16
    at Scope.$broadcast (http://10.14.213.161:9000/bower_components/angular/angular.js:12454:28)
    at Object.transitionTo (http://10.14.213.161:9000/bower_components/angular-ui-router/release/angular-ui-router.js:2032:26)
    at http://10.14.213.161:9000/loadbalancer/services/readonly.service.js:4:16
    at Scope.$broadcast (http://10.14.213.161:9000/bower_components/angular/angular.js:12454:28)
    at Object.transitionTo (http://10.14.213.161:9000/bower_components/angular-ui-router/release/angular-ui-router.js:2032:26)
    at http://10.14.213.161:9000/loadbalancer/services/readonly.service.js:4:16

Answer 1

您遇到的问题是您正在转换事件处理程序。这导致无限循环。相反，您需要明确避免在处理程序内部广播$ stateChangeStart。您可以使用notify:false标志执行此操作。试试这个：

$state.transitionTo("main.loadbalancer.readonly", null, {notify:false});

您还可以阅读complete API docs。

UI Router- stateChangeStart触发50次

1 个答案: