Dentro de un método (código a continuación) estoy tratando de establecer una serie de cadenas llamadas 'outerURL' en la promesa. y cuando se resuelve la promesa, envío los valores de 'outerURL' a una matriz llamada 'tableValues' para que se muestre en un .pdf.
Cuando trato de descargar el archivo .pdf en el primer intento después de que se carga la página, aparece 'indefinido' en el lugar donde se debe mostrar el contenido de 'outerURL'. Cuando intento descargar el archivo .pdf por segunda vez, puedo ver que se muestra el contenido de 'outerURL'.
En el primer intento de descargar el .pdf, parece que el método devuelve 'filePrintList' antes de que se complete la promesa y, en la segunda vez que descargo el .pdf, la promesa ya está completa y los valores de 'outerURL' están establecidos.
Mi pregunta es, ¿cómo puedo esperar a que finalice la promesa antes de devolver 'filePrintList'?
A continuación se muestra mi código:
let promise = new Promise((resolved, rejected) => { this.fileDetails.forEach(async file => { const rowValue: any = []; this.coreService.viewFileNew(file, false).subscribe( fileData => { this.showProgress(false); if (fileData.size > 0) { const url = URL.createObjectURL(fileData); this.outerURL.push(url); } else { file.isActive = false; } }, err => { console.log(err); } ); }); resolved(this.outerURL); }); promise.then(urls => { urls.forEach(url => { rowValue[this.FILE_PRINT_TABLE_COLUMN_NAME] = value; rowValues.push(rowValue); tableValues.push(url); }); }); fileTableList.rowDataList = rowValues; fileTableList.tableListData = tableValues; fileTableHeaderList.push(fileTableList); fileTable.tableList = fileTableHeaderList; fileTables.push(fileTable); filePrintList.tableList = fileTables; return filePrintList;¿Qué tal si envía la matriz de archivos al servicio y luego devolverá al componente una matriz de observables
service.ts
... export class CoreService { viewFileNew(files: any[], flag: boolean): Observable<any>[] { const result$: Observable<any>[] = []; for (let i = 0; i < files.length; i++) { // I guess the service function is doing something similar result$.push(this.http.get(.../files[i])); } return result$; } } component.ts
yourFunction() { this.showProgress(false); const rowValue: any = []; const array$ = this.coreService.viewFileNew(this.fileDetails, false); ... ... array$.forEach((data$, index) => data$.subscribe((data) => { if (data.size > 0) { const url = URL.createObjectURL(data); rowValue[this.FILE_PRINT_TABLE_COLUMN_NAME] = value; rowValues.push(rowValue); tableValues.push(url); if (index === array$.length - 1) { fileTableList.rowDataList = rowValues; fileTableList.tableListData = tableValues; fileTableHeaderList.push(fileTableList); fileTable.tableList = fileTableHeaderList; fileTables.push(fileTable); filePrintList.tableList = fileTables; // probably it will be useful to have some sort of a subject // so you can next the final result // probably there is a simpler approach, hope this helps a bit this._subject.next(filePrintList); } } else this.fileDetails[index].isActive = false; })) }