$ q - 控制函数执行的顺序

时间:2014-12-15 15:09:28

标签: javascript jquery angularjs

我是AngularJS的新手,我试图用一个承诺构建一个函数,所以只有在前一个函数完成后才运行。

我有一系列发票。除客户参考编号外,每张发票均不存储客户信息。使用客户参考编号,我想使用参考编号查询我的API以获取客户名称。

    $scope.invoices.forEach(function(invoice) {

        var defer = $q.defer();

        defer.promise.then(function(invoice) {

            var customer_id = invoice[$rootScope.data]["Id"][0].match(/\d+/)[0];

            $http.post('/customers', customer_id).success(function(response) {
                console.log("Response is: " + response);
                return response;
            });

        }).then(function(result) {
            invoice.customer_name = result;
            console.log("The final result is: " + result);
            return invoice.customer_name;
        });

        defer.resolve(invoice);
    });

注意:目前,我的API仅返回给定的参考号。

在我的控制台中,我看到以下输出:

(10) The final result is: undefined
Response is: 235
Response is: 239
Response is: 234
Response is: 238
Response is: 237
Response is: 236
Response is: 233
Response is: 232
Response is: 231
Response is: 230

如何确保第二个then仅在第一个之后运行?

1 个答案:

答案 0 :(得分:1)

在这种情况下的典型方法是将$q.all与promises数组一起使用。使用Array.prototype.map方法组合这样的数组很方便:

var promises = $scope.invoices.map(function(invoice) {

    var customer_id = invoice[$rootScope.data]["Id"][0].match(/\d+/)[0];

    return $http.post('/customers', customer_id).then(function(result) {
        invoice.customer_name = result.data;
        console.log("The final result is: " + result);
        return invoice.customer_name;
    });
});

$q.all(promises).then(function(responses) {
    // console.log(responses);
});

$q.all承诺解决时,您应该以正确的顺序获得一系列客户名称。