异步调用后暂停转换并重新启动

Question

我想检查每次我转换到的状态或它的父级是否有一些 isLogged 数据属性时记录用户。我的代码是：

        service.watchHasAccess = function(){
        $rootScope.$on('$stateChangeStart', function(event,toState,toStateParams){
            if(typeof toState.data !=='undefined' && typeof toState.data.loggedIn !== 'undefined' && toState.data.loggedIn == true){
                api.getWithPromise('user/isLoggedIn').then(function(response){
                    if(response.status !=='OK'){
                        event.preventDefault();
                        FlashMessage.showError('Zaloguj się aby przejść tutaj.');
                        $state.go('MainPage');                            
                    }
                });
            }
        });

问题是当转换到受限状态时它会加载，但它几乎立即重定向到 MainPage 状态。这就像闪光灯。这是因为我使用异步请求，所以我假设状态只是转换，无论请求的结果是什么，但随后响应来了，我被正确地转换了。我想要实现的是等到承诺得到解决然后检查并最终将用户重定向到'MainPage'。这可能吗？

Answer 1

您需要为您的 asyc 使用 Promise，并根据返回的内容解决或拒绝该 Promise。我建议 URL 切换将在 $stateChangeError 事件侦听器中进行，该事件侦听器会因拒绝承诺而被触发。你可以将reject([data])中你想去的位置传递给监听器。

http://fiddle.jshell.net/L9jxf/2/

一些承诺会在超时后拒绝（模拟服务器调用）

        protected: ['$timeout', '$q', function ($timeout, $q) {
            var deferred = $q.defer();
            $timeout(function () {
                deferred.reject({type:'redirect',location:'401'});
            }, 1000);
            return deferred.promise;
        }]

这会处理拒绝

app.run(function ($rootScope, $state) {
    $rootScope.$on('$stateChangeError', function (e, to, toParams, from, fromParams, error) {
        if (error.type === 'redirect') {
            $state.transitionTo(error.location);
        }
    });
});