$ .when() с массивом отложенных вызовов, не вызывающих выполненное действие

Question

Я пытаюсь использовать переменный набор отложенных функций в массиве вместе с $.when(). Эти функции извлекают данные с сервера и отображают их в DOM. После того, как все это будет сделано, будут загружены некоторые сценарии и выполнены несколько действий после загрузки.

Вот что я использую:

function loadAllGames(updateGames, updatePlayoffs) { 
    var deferredLoads = []; 
    if (updateGames !== false) 
     deferredLoads.push($.Deferred(loadGames)); 

    if (updatePlayoffs !== false) 
     deferredLoads.push($.Deferred(loadPlayoffs)); 

    $.when.apply($, deferredLoads).done(loadPostGamesLoadData); 
} 

Проблема заключается в том, что loadPostGamesLoadData никогда не вызывается.

Оба loadGames и loadPlayoffs возвращение обещает:

function loadGames() { 
    $.get('{% url wave_spinner_template %}', {message: 'Loading games...'}, function (data) { 
     $('#weeks').html(data); 
    }); 

    return $.ajax({ 
     url: "{% url weeks season.id %}", 
     success: function (data) { 
      $('#weeks').html(data); 
     }, 
     error: function() { 
      console.log("Error loading games."); 
     } 
    }); 
} 

function loadPlayoffs() { 
    $.get('{% url wave_spinner_template %}', {message: 'Loading playoffs...'}, function (data) { 
     $('#playoffs').html(data).children('.spinner-container').addClass('border-top'); 
    }); 

    return $.ajax({ 
     url: "{% url playoffs season.id %}", 
     success: function (data) { 
      var $playoffs = $('#playoffs'); 
      if (!$playoffs.length) { 
       $playoffs = $('<div>', {id: 'playoffs'}); 
       $('#weeks').after($playoffs); 
      } 
      $playoffs.html(data); 
     }, 
     error: function() { 
      console.log("Error loading playoffs."); 
     } 
    }); 
} 

Answer 1

Вы неправильно создаете отложенные объекты; действительно, вы не должны создавать их вообще. Функция, принятая $.Deferred, представляет собой заводскую функцию, выполняемую непосредственно перед возвратом $.Deferred, который получает новый отложенный объект в качестве аргумента (чтобы вы могли прикреплять к нему обработчики). (Details in the API docs.) Это не то, что loadGames и такие вообще вообще; они возвращение отложенный объект. Таким образом, вы попадаете в отложенные объекты, которые никогда не оседают.

Поскольку они уже отложили объекты $.ajax, которые вы возвращающиеся, просто использовать эти функции непосредственно:

function loadAllGames(updateGames, updatePlayoffs) { 
    var deferredLoads = []; 
    if (updateGames !== false) 
     deferredLoads.push(loadGames()); 
// ------------------------^^^^^^^^^^^ 

    if (updatePlayoffs !== false) 
     deferredLoads.push(loadPlayoffs()); 
// ------------------------^^^^^^^^^^^^^^ 

    $.when.apply($, deferredLoads).done(loadPostGamesLoadData); 
} 

Answer 2

уронить Deferred звонки, $.ajax уже возвращает отложила.

function loadAllGames(updateGames, updatePlayoffs) { 
    var deferredLoads = []; 
    if (updateGames !== false) 
     deferredLoads.push(loadGames()); 

    if (updatePlayoffs !== false) 
     deferredLoads.push(loadPlayoffs()); 

    $.when.apply($, deferredLoads).done(loadPostGamesLoadData); 
}