Проблема создания цепочки списка jQuery, отложенных вместе - PullRequest
0 голосов
/ 23 октября 2018

Я пытаюсь объединить воедино массив отложенных объектов jQuery, чтобы вызвать окончательную функцию после того, как все решено.

Однако я не могу получить $ .when.apply ($, deferreds) работать, но я не могу понять, почему это не работает.

function callBackend(count) {
  var deferred = $.Deferred();
  setTimeout(function() {
    $("div").append("<p>" + count + "</p>");
    deferred.resolve();
  }, 50);
  return deferred.promise();
}

$(function() {
  $("a").click(function() {
    var promises = [];
    for (i = 1; i <= 10; i++) {
      var deferred = $.Deferred();
      callBackend(i).then(function() {
        deferred.resolve();
      });
      promises.push(deferred.promise());
    }
    $.when.apply($, promises).then(function() {
      $("div").append("<p>All done!</p>");
    });
  });
});

Я создал скрипку, чтобы проиллюстрировать проблему.У кого-нибудь есть идея?

http://jsfiddle.net/YNGcm/2244/

Ответы [ 2 ]

0 голосов
/ 23 октября 2018

Вместо отложенного объекта jQuery вы можете напрямую работать с самим объектом Promise.

function callBackend(count) {

 return new Promise((resolve,reject) => {
         (function(c){
                 setTimeout(function() {
        $("div").append("<p>" + count + "</p>");
    resolve(c);
  }, 5000);
     })(count);
 });
}

$(function() {

  $("a").click(function() {
    var promises = [];
    for (i = 1; i <= 10; i++) {
      promises.push(callBackend(i));
    }

    Promise.all(promises).then(function() {
      $("div").append("<p>All done!</p>");
    });
  });
});
0 голосов
/ 23 октября 2018

Вы можете напрямую использовать отложенный элемент, созданный в callBackend.

function callBackend(count) {
  var deferred = $.Deferred();
  setTimeout(function() {
    $("div").append("<p>" + count + "</p>");
    deferred.resolve();
  }, 500);
  return deferred;
}

$(function() {
  $("a").click(function() {
    var promises = [];
    for (i = 1; i <= 10; i++) {
      var deferred = callBackend(i)
      promises.push(deferred);
    }
    $.when.apply($, promises).then(function() {
      $("div").append("<p>All done!</p>");
    });
  });
});

См. http://jsfiddle.net/gaby/YNGcm/2243/

...