Jquery ajaxコールバックでasyncが待機していますか？

Question

私はasync/awaitでこれをやろうとしていますが、解決策はあります。最後.insertBefore()完了するまで.detach()を実行しないように

series[group].forEach(async (ele, j) => { 
    await $.ajax({ 
     url: `templates/ele${ele}.template.html`, 
     success: function (data) { 
      const $copyEl = $(el).clone() 
      const r = new RegExp('\\{\\{\\s*' + item + '\\s*\\}\\}', 'g') 
      const html = $copyEl.html().replace(r, data) 

      $(html).insertBefore(parent) 
     }, 
     error: function (e) { 
      console.error(e) 
     }   
     }).then(() => { 
     $(parent).detach() 
     if(i + 1 === outer_last && j + 1=== inner_last) 
      template_callback() 
     }) 
    }) 
}) 

：誰もが、私はこれを変えることができる方法を知っていますか？

Answer 1

地図Promise sのあなたの配列の要素ごと、その後、Promise.allに依存しては：

const promises = series[group].map((ele) => (
    $.ajax({ 
     url: `templates/ele${ele}.template.html`, 
    }).then((data) => { 
     const $copyEl = $(el).clone() 
     const r = new RegExp('\\{\\{\\s*' + item + '\\s*\\}\\}', 'g') 
     const html = $copyEl.html().replace(r, data) 

     $(html).insertBefore(parent) 
    }, (e) => { 
     console.error(e) 
    }) 
)) 

Promise.all(promises).then(() => { 
    $(parent).detach() 
})