Desde ngOnchanges llamé al método _generateLocationFormForApproval y tiene una salida que es this.absoluteUri. Después de llamar a _generateLocationFormForApproval, la siguiente llamada es _pageEventDealsForApprovalList. Ahora quiero acceder al resultado de _generateLocationFormForApproval, que es this.absoluteUri dentro de _pageEventDealsForApprovalList después de su resultado, pero me da indefinido aunque this.absoluteUri tiene un valor.
¿Por qué this.absoluteUri no está definido dentro de _pageEventDealsForApprovalList?
Alguna idea ? con la llamada asíncrona? Gracias
#código
ngOnChanges(changes: SimpleChanges): void { if(this.dealId) { this._generateLocationFormForApproval(); this._pageEventDealsForApprovalList(); } } private _generateLocationFormForApproval() { this.dealService.generateLocationSubmission(this.dealId) .subscribe({ next: (res) => { if (res.isSuccess) { this.absoluteUri = res.data.absoluteUri; } }, error: err => this.notificationService.showError(err), complete: noop, }); } private _pageEventDealsForApprovalList() { console.log("1") console.log("this.absoluteUrithis.absoluteUri" , this.absoluteUri) this.searchInput = ''; const status = [DEAL.STATUS.FORAPPROVAL, DEAL.STATUS.APPROVED] this.dealType = []; this.isLoading = true; this.dealService .getAllDeals( status, this.accountId, this.transaction.id, this.table.pageIndex + 1, this.table.pageSize, this.searchInput, this.table.sortParams, this.table.sortDirs, this.dealType ) .pipe(finalize(() => (this.isLoading = false))) .subscribe((res) => { if(res) { console.log("this.uri" , this.absoluteUri) } }, (err) => this.notificationService.showError(err) ); }Intente usar Promise para llamar a dos API de forma asíncrona.
Usa este código
ngOnChanges(changes: SimpleChanges): void { if(this.dealId) { this._generateLocationFormForApproval().then((data)=>{ console.log(data) if(data) this._pageEventDealsForApprovalList(); } } } private _generateLocationFormForApproval() { return new Promise((resolve,reject)=>{ this.dealService.generateLocationSubmission(this.dealId) .subscribe({ next: (res) => { if (res.isSuccess) { this.absoluteUri = res.data.absoluteUri; resolve(this.absoluteUri); } }, error: err => { this.notificationService.showError(err); reject(err) }, complete: noop, }); }) } private _pageEventDealsForApprovalList() { console.log("1") console.log("this.absoluteUrithis.absoluteUri" , this.absoluteUri) this.searchInput = ''; const status = [DEAL.STATUS.FORAPPROVAL, DEAL.STATUS.APPROVED] this.dealType = []; this.isLoading = true; this.dealService .getAllDeals( status, this.accountId, this.transaction.id, this.table.pageIndex + 1, this.table.pageSize, this.searchInput, this.table.sortParams, this.table.sortDirs, this.dealType ) .pipe(finalize(() => (this.isLoading = false))) .subscribe((res) => { if(res) { console.log("this.uri" , this.absoluteUri) } }, (err) => this.notificationService.showError(err) ); }En este escenario, recomendaría usar la función switchMap de RxJs.
Haría algo similar a esto (advertencia: no probado):
ngOnChanges(changes: SimpleChanges): void { // It was originally this, but if you're looking for changes to the dealId you should use changes.dealId instead if (changes.dealId) { this.dealService.generateLocationSubmission(this.dealId) .pipe( switchMap(res => { if (!res.isSuccess) { return of(res); } this.absoluteUri = res.data.absoluteUri; return this._pageEventDealsForApprovalList(this.absoluteUri); }), finalize(() => (this.isLoading = false)) ) .subscribe( res => { if (res) { console.log('this.uri', this.absoluteUri); } }, err => this.notificationService.showError(err) ); } } private _pageEventDealsForApprovalList(absoluteUri): Observable<any> { console.log('1'); console.log('this.absoluteUrithis.absoluteUri', this.absoluteUri); this.searchInput = ''; const status = [DEAL.STATUS.FORAPPROVAL, DEAL.STATUS.APPROVED]; this.dealType = []; this.isLoading = true; return this.dealService.getAllDeals( status, this.accountId, this.transaction.id, this.table.pageIndex + 1, this.table.pageSize, this.searchInput, this.table.sortParams, this.table.sortDirs, this.dealType ); }