UI路由器stateChangeStart激發了50次

Question

UPDATE：我添加了一個控制檯語句，並且似乎這個偵聽器處理程序被調用了50次，對於這個事件。或者可以說這次事件是50次發射。任何想法爲什麼？可以做什麼？

修復更新：

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。