Изменение содержимого QR-кода компонента ⇐ Javascript

[Гость]

Я использую ngx-qrcode2 для генерации QR-кодов в своем угловом приложении. Мне нужно прикрепить набор QR-кодов к PDF-файлу и загрузить файл.

Я изменяю содержимое QR-компонента в цикле. в моем DOM я вижу, что qr-код меняется при запуске цикла.

fruits = ['манго', 'яблоко', 'апельсин'] асинхронная загрузка() { пусть документ = новый jsPDF(); пусть imgDataArr = []; for (const f of this.fruits) { this.qrvalue = f; while (!document.querySelector(".qrcode img")) { дождитесь нового обещания (r => setTimeout (r, 500)); console.log("ожидание qr"); } console.log("QR-элемент доступен"); const qrcode = document.getElementById('qrcode'); пусть imageData= this.getBase64Image(qrcode.firstChild.firstChild); imgDataArr.push(imageData) } for (константные данные imgDataArr) { doc.addImage(данные, "JPG", 10, 10); документ.ДобавитьСтраницу(); } doc.save('FirstPdf.pdf'); } Однако окончательный PDF-файл, который я загружаю, содержит три QR-кода с одинаковыми данными.

Почему это? Есть ли задержка перед изменением элемента? Как это исправить?

StackBlitz

Обратите внимание, что моя реализация во многом основана на этом ответе.