javascript - Angular 中基于数组值的带有 Promise 的多个 Ajax 请求

Question

我正在按 Angular 顺序实现多个ajax调用。我想要实现的是与 $.ajax 一起正常工作，但是当我使用 Angular 实现并使用 $http 进行服务器请求时，它不起作用。我想知道两者都返回 Promise 对象，那么为什么它不能正常工作。

使用$.ajax

shoppingList.split(",").reduce(function(resultPromise, shoppingItem) {

    return resultPromise.then(function(result) {
        pro = $.ajax('/items/'+shoppingItem);
        return pro.then(function(res) {
            console.log(result);
            result.push(new Item(res.label,res.price));
            return result;
        });
    });
}, $.when([])).then(completeCallback);

查看工作 fiddle - JSFiddle

使用 Angular $http

function fetchDataDayWise(dateRanges,completeCallback) {
        return dateRanges.reduce(function(resultPromise, dt) {
            return resultPromise.then(function(resultData) {
                machinePromise = getData();
                return machinePromise.then(function(data) {
                    if(data && data.length > 0)
                    {
                        resultData = resultData.concat(data);
                    }
                    console.log(resultData);
                    return resultData;
                });
            });
        }, $.when([])).then(completeCallback);
    }

    var dateRanges = [1,2,3,4]

    function setData(data) {
        console.log("data",arguments);

    }
    fetchDataDayWise(dateRanges,setData);

请参阅Plunkr

可以在控制台看到。在 JSFiddle 中，您将获得项目数组，而在 Angular plunkr 中，它返回对象。我猜它是 promise 对象。

如有任何帮助，我们将不胜感激。

Answer 1

在您的服务中，您使用 $http.get，这会返回一个 promise ，这是您所看到的对象，要从中获取您需要的值(在您的情况下):

deferred.resolve(data.data);

而不是

deferred.resolve(data);

希望这有帮助。如果您还有其他问题，我很乐意回答。

更新:

这并不完全适合您的代码，但它将为您提供如何实现顺序调用的示例。

var prevPromise = $q.resolve();
prevPromise = prevPromise.then(function() {
this.someValue=值；//包含查询结果的数据库数组
返回 this.function(req, res);
}.bind(this));