0

有人可以解释一下为什么Angular UI Router Extras添加触发两次(在初始化时!)$stateChangeStart事件,以防我有一些异步 ajax 检查和e.preventDefault()调用?

短事​​件代码示例:

 $rootScope.$on("$stateChangeStart", function (e, toState, toParams, fromState, fromParams, error) {
       console.log("$stateChangeStart");//fired twice
       if(!User.data) {
             e.preventDefault();
             $http.get("https://randomuser.me/api/")
             .success(function(data, status, headers, config) {
                  console.log(data);
                  User.data = data; 
                  $state.go(toState, toParams);
              });
       }              
 });

完整的 FIDDLE 示例

没有额外的东西,一切都按预期工作。

肿瘤坏死因子

4

1 回答 1

0

Angularjs 在其摘要周期中进行了多次检查以检查更改前后的内容,这可能是该周期的一部分。

您可以在 $watch 期间看到此行为。

$scope.$watch('myVariable', function( change ){
  if( !change ){ return; }
  // do important things here.
});

在第一轮摘要更改参数将作为undefined进入,直到myVariable设置在其他地方。一旦myVariable设置为 else-wear,$watch 将再次触发并突破 if 块做一些真正的工作。

如果您的函数是这种情况,也许您可​​以添加一个if块,如果您的一个或多个参数未定义,或者您没有执行某些值,则返回。

$rootScope.$on("$stateChangeStart", function (e, toState, toParams, fromState, fromParams, error) {

  if( !e || !toStateForExample || anotherParameter ){ return; }

  console.log("$stateChangeStart");//fired twice
  if(!User.data) {
    e.preventDefault();
    $http.get("https://randomuser.me/api/")
    .success(function(data, status, headers, config) {
      console.log(data);
      User.data = data; 
      $state.go(toState, toParams);
    });
   }              
 });
于 2015-07-21T22:07:17.470 回答