角UI路由器（演員）$ stateChangeStart事件觸發兩次

有人能解釋我爲什麼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); 
       }); 
     }    
});

Full FIDDLE Example

沒有額外添加的一切工作正常。

TNX

來源

2015-07-21 Vlatko

刪除'e.preventDefault（）;' – Ronnie

然後永遠不會執行的成功回調狀態變化 – Vlatko

觸發一次，可以防止因爲數據還沒有恢復....您重定向並再次閃光。要做這個API調用主要應用程序狀態 – charlietfl

Angularjs該週期的其消化週期來檢查之前和之後的變化，這可能是部分期間具有多個檢查。

您可以在$ watch期間看到此行爲。

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

在第一輪摘要變化參數將做爲未定義的，直到MYVARIABLE被設置在其他地方。一旦myVariable被設置爲else-wear，那麼$ watch將再次觸發並突破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-21 22:07:17 SoEzPz

我認爲，必須存在更優雅的解決方案來解決這個問題。這額外增加有時是真的越野車 – Vlatko

先試一下，看看思想是否正確，然後重構，以匹配您現有的優雅。 – SoEzPz

角UI路由器（演員）$ stateChangeStart事件觸發兩次

回答

相關問題