Функция Promise запускается после document.getElementById

Question

У меня есть функция обещания, которая содержит функцию обещания:

function readOrderFromDB(collection, tableID) {
            ....
            ....
        // inner promise function
        student.where('ID', '==', doc.data().studentID).get().then((studentDoc) => {
           studentDoc.forEach((d) => {
              document.getElementById(text).innerHTML += `<td style="text-align: center">
              ${`${d.data().firstname}  ${d.data().lastname}`}</td>`;
           });
        });
        document.getElementById(id).innerHTML += `<td style="text-align: center">${doc.data().numPayments}</td>`;

У меня есть такая проблема: когда я запускаю свой код, document.getElementById(id)... запускается перед функцией внутреннего обещания, хотя и внутреннее обещание предшествует этому. я знаю, что нужно использовать какую-то функцию syn c или ждать, но я не понял, как правильно ее поставить.

Answer 1

Вы должны вызвать последний document.getElementById (id) ... внутри области then. Обещания выполняются параллельно, поэтому, если какая-то часть вашего кода полагается на то, что вы обновляете внутри тогдашней области, эта часть также должна быть в той области.

она должна работать:

function readOrderFromDB(collection, tableID) {
        ....
        ....
    // inner promise function
    student.where('ID', '==', doc.data().studentID).get().then((studentDoc) => {
        studentDoc.forEach((d) => {
            document.getElementById(text).innerHTML += `<td style="text-align: center">
            ${`${d.data().firstname}  ${d.data().lastname}`}</td>`;
        });
        document.getElementById(id).innerHTML += `<td style="text-align: center">${doc.data().numPayments}</td>`;        
   });