Angular UI-Router——在resolve中返回被拒绝的承诺并不能停止状态转换

Angular UI-Router - Returning rejected promise in resolve is not stopping state transition

本文关键字：并不能 承诺 状态 转换 UI-Router resolve Angular 返回 拒绝      更新时间：2023-09-26

我试图确保在允许用户转换到特定状态之前对其进行了身份验证。正如我所理解的那样(在审查其他帖子之后)，如果状态的解析返回被拒绝的承诺并且应该引发'$stateChangeError'事件，则不应该发生状态转换。然而，这不是我所经历的。

逐步执行下面的代码，我可以看到延迟的承诺被拒绝，但状态转换仍然发生，并且没有触发'$stateChangeError'。在我的模块配置中，我有以下状态:

 .state('accounts', {
            url: '/Accounts',
            controller: 'AccountsController',
            templateUrl: 'Scripts/angular/accounts/templates/accounts.tpl.html',
            resolve: {
                authenticated: ['$q', 'AccountService', function ($q, accountService) {
                    var deferred = $q.defer();
                    accountService.userLoggedIn().then(function (loggedIn) {
                        if (loggedIn) {
                            deferred.resolve();
                        } else {
                            deferred.reject('Not logged in'); <-- This happens
                        }
                        return deferred.promise;
                    });
                }]
            }
        })

在同一个模块中，在run函数中，我有:

 $rootScope.$on('$stateChangeError',
    function (event, toState, toParams, fromState, fromParams, error) {
        $log.debug(error); <-- This is never called
        $state.go('login');
    });

我错过了什么?

您将promise返回到错误的位置。Authenticated需要是一个返回承诺的函数但你只是在。then()函数中返回承诺然后Authenticated返回undefined 

        resolve: {
            authenticated: ['$q', 'AccountService', function ($q, accountService) {
                var deferred = $q.defer();
                accountService.userLoggedIn().then(function (loggedIn) {
                    if (loggedIn) {
                        deferred.resolve();
                    } else {
                        deferred.reject('Not logged in'); <-- This happens
                    }
                });
                return deferred.promise;
            }]
        }

你不需要创建新的deferred，因为你已经从userLoggedIn()获得了promise:

resolve: {
    authenticated: ['$q', 'AccountService', function ($q, accountService) {
        return accountService.userLoggedIn().then(function (loggedIn) {
              if (loggedIn) {
                   return loggedIn;
              } else {
                   return $q.reject('Not logged in'); 
              }
        });
     }]
}
相关文章：