Question

我有两个url端点说：＆＃34; fruitInfo＆＃34;和＆＃34; fruitDetails＆＃34;

我想返回一个包含以下内容的对象：

var fruitInfoDetails = {"fruitInfo": <contents of fruitInfo response data>,
"fruitDetails": <contents of fruitDetails response data>}

在服务中我打电话：

var fruitInfoDetails = {};
this.getFruitInfo()
.then(function(data) {

   fruitInfoDetails['fruitInfo'] = data;
   this.getFruitDetails(data.nameOfFruit).then(function(data) {
        fruitInfoDetails['fruitDetails'] = data;      
   })
});

假设this.getFruitInfo（）和this.getFruitDetauls（）包含返回每个端点的$ http promise的函数。

这样做的正确/优雅方式是什么？如果有一个函数我可以传递一个水果列表＆＃34; [Apple，Pear，Orange]＆＃34;，它可以返回一个fruitInfoDetails对象列表，这将是完美的。

Answer 1

您可以使用 $ q 服务制定自己的承诺，并在第二次调用完成后解决此问题。

angular.module('mymodule').factory('FruitService', function($http, $q) {
return {
    getFruitInfoDetails: function() {
        // make our own promise
        var deferred = $q.defer();
        // 1st call
        $http.get("fruitInfo").then(function(fruitInfo) {
            // 2nd call
            $http.get("fruitDetails").then(function(fruitDetails) {

                deferred.resolve({
                    fruitInfo: fruitInfo,
                    fruitDetails:fruitDetails
                });
            });
        });
        return deferred.promise;
    }
};
});

您还可以使用 $ q.all（），等待两个请求在解析之前完成。它可以减少压痕。

angular.module('mymodule').factory('FruitService', function($http, $q) {
return {
    getFruitInfoDetails: function() {
        // make our own promise
        var deferred = $q.defer();
        // 1st call
        var infoPromise = $http.get("fruitInfo");
        var detailsPromise = $http.get("fruitDetails");

        $q.all([infoPromise, detailsPromise]).then(function(data) {
            deferred.resolve({
                fruitInfo: data[0],
                fruitDetails: data[1]
            })
        });

        return deferred.promise;
    }
};
});

请求检索给定水果的列表：

angular.module('mymodule').factory('FruitService', function($http, $q) {

return {
    getFruitInfoDetails: function(fruit) {
        // make our own promise
        var deferred = $q.defer();

        // we'll asume that you can put the fruit as part of the path
        var infoPromise = $http.get("fruitInfo/" + fruit);
        var detailsPromise = $http.get("fruitDetails/" + fruit );

        $q.all([infoPromise, detailsPromise]).then(function(data) {
            deferred.resolve({
                fruitInfo: data[0],
                fruitDetails: data[1]
            })
        });

        return deferred.promise;
    },

    getFruitList: function(fruits) {
        var deferred = $q.defer();

        // map our list of fruits to a list of the promises of fruit info
        var allPromises = fruits.map(function (fruit) {
            return this.getFruitInfoDetails(fruit);
        });

        // wait for all the fruits to be resolved then just resolve our own promise
        $q.all(allPromises).then(function(allTheFruitInfoDetails) {
            deferred.resolve(allTheFruitInfoDetails);
        });
        return deferred.promise;
    }
};
});

如何以角度返回多个依赖于彼此的$ http请求？

1 个答案: