通过我的AJAX调用获取关于如何使用jQuery Deferreds的问题

Question

在我的网页中有2个部分需要单独的AJAX调用，然后在将内容注入到DOM之前进行数据模板化。现在我正在研究这样做的最佳方式，并且我一直在阅读大量关于jQuery Deferreds的文章，这么多关于我并不完全确定最佳方式的文章。下面是我认为我会使用的代码，但我会非常感激一些输入。如果有人想为此添加一些建议，我对缓存也很朦胧。

JS

function ajaxCall1() { 
    var dfd = $.Deferred(); 
    return $.ajax({ 
     type: 'POST', 
     dataType: 'json', 
     url: '/url1', 
     data: { }, 
     success: function(data) { 
      // Run templating code 
     } 
    }); 
    return dfd.promise(); 
} 

function ajaxCall2() { 
    var dfd = $.Deferred(); 
    return $.ajax({ 
     type: 'POST', 
     dataType: 'json', 
     url: '/url2', 
     data: { }, 
     success: function(response) { 
      // Run templating code 
     } 
    }); 
    return dfd.promise(); 
} 

$.when(ajaxCall1(), ajaxCall2()) 
    .then(function(){ 
     // Display DOM elements 
    }) 
    .fail(function(){ 
     // Display error message 
    }); 

Answer 1

为了与Deferreds工作，你应该在

function ajaxCall1() { 
    var dfd = new $.Deferred(); 
    $.ajax({ 
     ... 
     success: function(data) { 
     dfd.resolve(data); 
     } 
    }); 
    return dfd.promise(); 
} 

function ajaxCall2() { 
    var dfd = new $.Deferred(); 
    $.ajax({ 
     ... 
     success: function(data) { 
     dfd.resolve(data); 
     } 
    }); 
    return dfd.promise(); 
} 

$.when(ajaxCall1(), ajaxCall2()).then(function(data1, data2) { 
    // data1 holds the result of the first ajax call, data2 that of the second call 
}); 

编辑的行

1 - generate a new $.Deferred() 
2 - return its .promise() from the function 
3 - .resolve() the deferred in the callback of the Ajax request 

东西：既然$。阿贾克斯（）已经返回推迟，你可以这样做，就像

function ajaxCall1() { 
    return $.ajax({ 
     ... 
    }); 
} 

function ajaxCall2() { 
    return $.ajax({ 
     ... 
    }); 
} 

$.when(ajaxCall1(), ajaxCall2()).done(function(data1, data2) { 
    // data1 holds the result of the first ajax call, data2 that of the second call 
});