Como eu posso exibir um loading na tela, durante o tempo de requisição de 2 ou mais requestes com Ionic 3 e/ou Angular 4?
Eu tentei fazer a chamada do loading nas duas requisições, mas sempre que a requisição mais rapida finaliza, ela ja esconde o loading, sem que a segunda esteja finalizado.
ionViewDidLoad() {
this.getSummary(parametros);
this.getHeatmap(parametros);
}
getSummary() {
this.loadingService.showLoader(this.constants.MSG_LOADING);
this.remedyProvider.getSummaryByDate().subscribe(
(response) => {
/// do something
}, (error) => {
this.showSummary = false;
console.log(`Backend returned error was: ${error}`);
this.loadingService.hideLoader();
}, () => {
console.log('get heatmap complete');
this.loadingService.hideLoader();
}););
}
getHeatmap() {
this.loadingService.showLoader(this.constants.MSG_LOADING);
this.remedyProvider.getHeatmap().subscribe(
(response) => {
//do something
}, (error) => {
console.log(`Backend returned error was: ${error}`);
}, () => {
console.log('get heatmap complete');
this.loadingService.hideLoader();
});
}
Code of LoadingProvider (loadginService):
export class LoadingProvider {
loader: any = null;
constructor(private _loadingController: LoadingController) {
}
private showLoadingHandler(message) {
if (this.loader == null) {
this.loader = this._loadingController.create({
content: message
});
this.loader.present();
} else {
this.loader.data.content = message;
}
}
private hideLoadingHandler() {
if (this.loader != null) {
this.loader.dismiss();
this.loader = null;
}
}
public showLoader(message) {
this.showLoadingHandler(message);
}
public hideLoader() {
this.hideLoadingHandler();
}
}