如何在Ionic 2中为多个请求显示LoadingController

Question

根据Ionic文档,我可以使用以下代码加载Ionic LoadingController:

ionViewLoaded() {
  let loader = this.loading.create({
    content: 'Getting latest entries...',
  });

  loader.present().then(() => {
    this.someService.getLatestEntries()
      .subscribe(res => {
        this.latestEntries = res;
        loader.dismiss();
      });

  });
}

如果我只是发出1个ajax请求,这样可以正常工作.但我有5个要求,如果我隐藏/显示加载控制器这样会导致屏幕闪烁.

有没有办法可以呈现loadingController,但dismiss()只有当所有的Ajax请求都已完成时？

EDIT:请求不依赖于彼此.他们是独立的.我正在寻找的是一种在所有可观察的请求完成时得到通知的方法.这样,当所有这些都完成时,我可以解除LoadingController.

Answer 1

我在我的应用程序中使用以下实用程序.如果我们想要显示相同的加载器并且需要在不同的步骤更改加载器文本,这也适用于多个步骤或/和页面.

我们可以多次调用showLoader(),最终需要调用hideLoader().

@Injectable()
export class Utility {
    loader: any = null;
    constructor(private _alertCtrl: AlertController,
        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();
    }
}