在 jQuery 中将数据从 .when 传递到 .then

Question

我正在尝试使用带有 .each 的 .when 来遍历某些元素，然后 .then 对结果进行处理。但我不确定如何存储 .when 的结果以在 .then.

中使用

例如

var widget_data = [];

$.when(
    $.each(widget_ids, function(index, widget_id){
        $.get('/widget/' + widget_id, function(data){
            widget_data.push(data);
        });
    })
)
    .then(function(){
        console.log(widget_data);
    });

widget_data数组在运行后为空。

Answer 1

您需要使用.map() not .each()

var widget_data = [];
$.when.apply($,
    $.map(widget_ids, function(widget_id, index) {
      return $.get('/widget/' + widget_id, function(data) {
        widget_data.push(data);
      });
    })
  )
  .then(function() {
    console.log(widget_data);
  });

当您使用 .each() 时，它 returns 传递给它的数组，因为它不是 promise 对象，$.when() 将认为它已解决并调用then 处理程序无需等待 ajax 请求完成。

您可以使用 $.map() 从源数组创建一个 promise 对象的数组，它可以像上面那样传递给 $.when()，在这种情况下，then 处理程序将只在之后调用请求已完成 - 但请注意，结果数组中值的顺序可能与源数组中项目的顺序不匹配。

Answer 2

一个问题是 when 需要获取 deferered 作为参数，而 $.each 没有 return。

var promises = [];
$.each(widget_ids, function(index, widget_id){
    promises.push( $.get('/widget/' + widget_id, function(data){
        widget_data.push(data);
    }) );
});

$.when.apply($, promises);
 .then(function(){
    console.log(widget_data);
});

在 jQuery 中将数据从 .when 传递到 .then

passing data from .when to .then in jQuery

jquery

promise

.when