javascript - 有条件地在 Controller 中接收同步或异步对象( Angular 、 ionic )

Question

我有以下 Controller :

.controller('SponsorsCtrl', function ($scope, Sponsors, $http) {
    $scope.$on('$ionicView.enter', function () {
        Sponsors.all($http).then(function (data) {
                $scope.sponsors = data;
                var check = "check";
                })       
    });
})

之所以使用“then”是因为我收到了一个异步对象。现在我还可以通过以下服务接收同步对象:(功能(){ Angular .module('赞助商服务', []) .factory('赞助商', 赞助商);

Sponsors.$inject = [];

function Sponsors() {

    var service = {
        all: all,
        allServer: allServer,
        allLocal: allLocal,
        get: get,
        getTimeStamp: getTimeStamp
    };
    return service;

    function all($http) {
        var timeDifference = (Date.now() - this.getTimeStamp());

        if (timeDifference < 600000) {
            return this.allLocal();
        }
        else {                
            return this.allServer($http);       
        }
    }

    function allServer($http) {
        return $http.get("http://dream16backend.azurewebsites.net/api/dream16/sponsors")
                    .then(function (resp) {
                        //Set localstorage, create timestamp and return the data
                        window.localStorage.setItem('sponsors', resp.data);
                        window.localStorage.setItem('sponsorsTimeStamp', Date.now());
                        var bla = JSON.parse(window.localStorage.getItem('sponsors'));
                        return bla;
                    }, function(err) {
                        console.log('ERR', err);
                    });            
    }

    function allLocal() {
        return JSON.parse(window.localStorage.getItem('sponsors'));
    }

    function get(adressId) {
        for (var i = 0; i < sponsors.length; i++) {
            if (sponsors[i].id === parseInt(sponsorId)) {
                return sponsors[i];
            }
        }
        return null;
    }

    function getTimeStamp() {           
        return window.localStorage.getItem('sponsorsTimeStamp');
    }
}

})();这样，只有异步调用(函数 allServer)有效，但同步失败，因为: Sponsors.all(...).then 不是函数

然后我认为修复方法是将“然后”功能移至服务中的所有功能。这使得同步调用(函数 allLocal)工作，但现在异步调用失败。 else 条件现在看起来像这样:

else {
                this.allServer($http).then(function (data) {
                    return data;
                })
            }

Controller 看起来像:

.controller('SponsorsCtrl', function ($scope, Sponsors, $http) {
    $scope.$on('$ionicView.enter', function () {
        $scope.sponsors = Sponsors.all($http);
        var check = "check"; 
    });
})

我验证了调用本身正在工作(通过测试变量“bla”)。我还看到 Controller 运行 var check = "check";在运行异步代码之前。我在这里做错了什么？

Answer 1

好的...因此您需要为 Sponsors.all() 的两个实例返回一个 Promise，因为一个实例已经返回 $http Promise。

在服务中注入(inject) $q ，以便 allLocal() 也将返回一个 Promise。

function allLocal() {
    return $q.resolve(JSON.parse(window.localStorage.getItem('sponsors')));
}

在 Controller 中你需要使用then()

$scope.$on('$ionicView.enter', function () {
    Sponsors.all($http).then(function(data){
       $scope.sponsors = data;
    });
    var check = "check"; 
});

正如上面评论中提到的，不需要在 Controller 中注入(inject) $http 并将其传递给服务，因为在服务中注入(inject) $http 会更简单，其中确实需要