Выполнение цикла обещаний по порядку и ожидание завершения выполнения

Question

Я пытаюсь запустить цикл, в котором promise и его собственные then создаются для каждой итерации.Я хочу напечатать «Готово» только тогда, когда все обещания выполнены (по порядку).Что бы я ни делал, «готово» всегда выполняется перед «рендерингом»!Я знаю, это звучит как дубликат, но ничего не работает, может быть, добавление promise и 'then` для каждой итерации является проблемой.

        let p = Promise.resolve<void>()
        for (let i = 0; i < data.results.length; i++) {
            p = p.then(_ => template.instantiateToElement(data.results[i]).then(res => {
                console.log('rendering');
            }));
        };
        p.then(_ => {
            console.log('done');
        });

** template.instantiateToElement () возвращает a promise

Answer 1

Ваша проблема в том, что к тому времени, когда вы позвоните instantiateToElement(), цикл, использующий i, завершится, и единственное значение для i, которое увидит код, будет data.results.length.

. Вы должны использоватьвызов функции для привязки необходимого значения i:

const instantiate = (i) => (_ => template.instantiateToElement(data.results[i]));
let p = Promise.resolve<void>();
for (let i = 0; i < data.results.length; i++) {
    p = p.then(instantiate(i)).then(res => {
        console.log('rendering');
    }));
}
p.then(_ => {
    console.log('done');
});

Вызов instantiate(i) происходит во время цикла for и создает функцию, для которой i связано в новом замыкании.