javascript - 等待 AngularJS $http 中的响应

Question

好吧，所以我很确定我已经多次找到答案 - 我只是不明白。

我正在构建一个单页面应用程序，该应用程序在每个 $routeChangeStart 上检查用户是否已登录。如果用户未登录，则重定向到登录页面。 我的问题是 configService.isLoggedIn() 使用 $http，这意味着它是异步的，其余代码不会等待它被解析。

简而言之，问题是:在继续任何其他代码之前，我需要先解决 isLoggedIn() 函数。

我在 $q.defer() 上见过很多，但我无法理解它。

提前致谢。

app.service('configService', ['$http', '$q', '$location', '$rootScope', function ($http, $q, $location, $rootScope) {
    var self = this;

    this.isLoggedIn = function () {
        $http.get('/internalAPI.php?fn=login').then(function (result) {
            if (result.data.isLoggedIn === true) {
                $rootScope.isLoggedIn = true;
            }
            else {
                $rootScope.isLoggedIn = false;
            }
        }, function() {
            $rootScope.isLoggedIn = false;
        });
        return $rootScope.isLoggedIn;
    }
}]);

app.service('navigationService', ['$rootScope', '$location', '$timeout', 'configService', function ($rootScope, $location, $timeout, configService) {

    var self = this;

    $rootScope.$on('$routeChangeStart', function (event, next, current) {
        if (configService.isLoggedIn() !== true) {
            // no logged in user, redirect to /login
            if (next.templateUrl != "resources/views/login.php") {
                $location.path("/login");
                $rootScope.subTitle = 'Login';
            }
        //user is logged in but is trying to view the login page, redirect
        } else if (next.templateUrl == 'resources/views/login.php') {
            $location.path('/');
        }

Answer 1

您可以从函数返回 Promise 并对该 Promise 对象进行操作。根据Angular $http documentation $http 对象基于 promise mechanism

app.service('configService', ['$http', function ($http) {
    var self = this;

    this.isLoggedIn = function () {
        return $http.get('/internalAPI.php?fn=login');
    }
}]);

app.service('navigationService', ['$rootScope', '$location', '$timeout', 'configService', function ($rootScope, $location, $timeout, configService) {

    var self = this;

    $rootScope.$on('$routeChangeStart', function (event, next, current) {
        configService.isLoggedIn().then(function(result) {
            if (result !== true) {
                // no logged in user, redirect to /login
                if (next.templateUrl != "resources/views/login.php") {
                    $location.path("/login");
                    $rootScope.subTitle = 'Login';
                }
            //user is logged in but is trying to view the login page, redirect
            } else if (next.templateUrl == 'resources/views/login.php') {
                $location.path('/');
            }
        }
    }
}