javascript sync ajax call issue

Question

i ma пытается получить список имен htmls из ajax-вызова, а затем для каждого html-вызова ajax, а затем я пытаюсь добавить его с помощью handlebar. но этого не происходит с кодом ниже. может кто-нибудь мне помочь в отладке его:

$.getJSON('api/filterTemplate/' + pageName.page, function (data) { 
    var promises = []; 
    $.each(data, function (i, rec) { 
     promises.push($.get('commonCore/templates/' + rec.templateHtml)); 
    }); 
    $.when.apply(this, promises).then(function() { //after all requests complete 
     $.each(arguments, function(i, html) { 
      var filterTemplate = Handlebars.compile(html); 
      replaceFilterTemplate(filterTemplate,data[i].classids);// this functions appends html to div -data[i].classids 
     }) 
    }) 
}); 

после каждого HTML забирается она должна быть добавлена, а затем следующий вызов должен произойти

Answer 1

$.get возвращает объект jqXHR. Это то, что вы на самом деле добавляете к вашему массиву promises.

Вы должны использовать синхронные вызовы или переформатировать свой код, чтобы обрабатывать все асинхронные выборки, а затем выполнять обещания.

Synchrone альтернатива:

$.each(data, function (i, rec) { 
    $.ajax({ 
     url: 'commonCore/templates/' + rec.templateHtml, 
     async: false, 
     success: function(result) { 
      promises.push(result); 
     } 
    }); 
});