108

So I have a situation where I have multiple promise chains of an unknown length. I want some action to run when all the CHAINS have been processed. Is that even possible? Here is an example:

app.controller('MainCtrl', function($scope, $q, $timeout) {
    var one = $q.defer();
    var two = $q.defer();
    var three = $q.defer();

    var all = $q.all([one.promise, two.promise, three.promise]);
    all.then(allSuccess);

    function success(data) {
        console.log(data);
        return data + "Chained";
    }

    function allSuccess(){
        console.log("ALL PROMISES RESOLVED")
    }

    one.promise.then(success).then(success);
    two.promise.then(success);
    three.promise.then(success).then(success).then(success);

    $timeout(function () {
        one.resolve("one done");
    }, Math.random() * 1000);

    $timeout(function () {
        two.resolve("two done");
    }, Math.random() * 1000);

    $timeout(function () {
        three.resolve("three done");
    }, Math.random() * 1000);
});

In this example, I set up a $q.all() for promises one, two, and three which will get resolved at some random time. I then add promises onto the ends of one and three. I want the all to resolve when all the chains have been resolved. Here is the output when I run this code:

one done 
one doneChained
two done
three done
ALL PROMISES RESOLVED
three doneChained
three doneChainedChained

Is there a way to wait for the chains to resolve?

4

5 回答 5

164

当所有的链条都解决后，我希望一切都解决。

当然，然后只需将每个链的承诺传递给all()而不是最初的承诺：

$q.all([one.promise, two.promise, three.promise]).then(function() {
    console.log("ALL INITIAL PROMISES RESOLVED");
});

var onechain   = one.promise.then(success).then(success),
    twochain   = two.promise.then(success),
    threechain = three.promise.then(success).then(success).then(success);

$q.all([onechain, twochain, threechain]).then(function() {
    console.log("ALL PROMISES RESOLVED");
});
于 2014-02-13T17:47:47.633 回答
16

接受的答案是正确的。我想提供一个例子来给不熟悉的人稍微详细说明一下promise。

例子：

在我的示例中，我需要在呈现内容之前用不同的镜像 url 替换标签的src属性（如果可用）。img

var img_tags = content.querySelectorAll('img');

function checkMirrorAvailability(url) {

    // blah blah 

    return promise;
}

function changeSrc(success, y, response) {
    if (success === true) {
        img_tags[y].setAttribute('src', response.mirror_url);
    } 
    else {
        console.log('No mirrors for: ' + img_tags[y].getAttribute('src'));
    }
}

var promise_array = [];

for (var y = 0; y < img_tags.length; y++) {
    var img_src = img_tags[y].getAttribute('src');

    promise_array.push(
        checkMirrorAvailability(img_src)
        .then(

            // a callback function only accept ONE argument. 
            // Here, we use  `.bind` to pass additional arguments to the
            // callback function (changeSrc).

            // successCallback
            changeSrc.bind(null, true, y),
            // errorCallback
            changeSrc.bind(null, false, y)
        )
    );
}

$q.all(promise_array)
.then(
    function() {
        console.log('all promises have returned with either success or failure!');
        render(content);
    }
    // We don't need an errorCallback function here, because above we handled
    // all errors.
);

解释：

来自 AngularJS文档：

then方法：

then(successCallback, errorCallback, notifyCallback) – 无论承诺何时被解决或被拒绝，只要结果可用，就会异步调用成功或错误回调之一。使用单个参数调用回调：结果或拒绝原因。

$q.all（承诺）

将多个 Promise 组合成一个 Promise，当所有输入 Promise 都解决时，该 Promise 将被解决。

promises参数可以是一组承诺。

关于bind()，更多信息在这里：https ://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/bind

于 2015-02-26T18:08:47.437 回答
4

最近遇到了这个问题，但是 promises 的数量未知。使用jQuery.map() 解决了。

function methodThatChainsPromises(args) {

    //var args = [
    //    'myArg1',
    //    'myArg2',
    //    'myArg3',
    //];

    var deferred = $q.defer();
    var chain = args.map(methodThatTakeArgAndReturnsPromise);

    $q.all(chain)
    .then(function () {
        $log.debug('All promises have been resolved.');
        deferred.resolve();
    })
    .catch(function () {
        $log.debug('One or more promises failed.');
        deferred.reject();
    });

    return deferred.promise;
}
于 2015-11-18T10:46:13.977 回答
0

有一种方法。$q.all(...

您可以检查以下内容：

http://jsfiddle.net/ThomasBurleson/QqKuk/

http://denisonluz.com/blog/index.php/2013/10/06/angularjs-returning-multiple-promises-at-once-with-q-all/

于 2014-02-13T16:12:43.803 回答
0

您可以在“异步函数”中使用“等待”。

app.controller('MainCtrl', async function($scope, $q, $timeout) {
  ...
  var all = await $q.all([one.promise, two.promise, three.promise]); 
  ...
}

注意：我不是 100% 确定您可以从非异步函数调用异步函数并获得正确的结果。

也就是说，这永远不会在网站上使用。但是对于负载测试/集成测试......也许。

示例代码：

async function waitForIt(printMe) {
  console.log(printMe);
  console.log("..."+await req());
  console.log("Legendary!")
}

function req() {
  
  var promise = new Promise(resolve => {
    setTimeout(() => {
      resolve("DARY!");
    }, 2000);
    
  });

    return promise;
}

waitForIt("Legen-Wait For It");

于 2018-02-28T17:14:47.847 回答