页面加载时的角度/离子加载图标

Question

我正在Angular / Ionic中构建应用程序，并希望使用ion-loading组件在页面仍在加载时显示加载图标。

但是，我在文档中找不到很多有关此的信息，但是您如何实际检查是否已加载所有内容？看来您必须为离子加载组件分配一个持续时间。有人可以指出我正确的方向吗？

作为一种解决方法（下面的代码），我强制应用程序按顺序加载所有内容，但这并不理想，因为我仍然希望该应用程序并行执行一些操作以提高加载速度。

  loading: any;
  async presentLoading() {
    this.loading = await this.loadingController.create({
      message: 'Loading...'
    });
    await this.loading.present();
  }

  async initializeApp() {
    this.presentLoading();
    await this.getData();
    await this.getCurrentDate();
    await this.loading.dismiss();
  }

  ngOnInit() {
    this.initializeApp();
  }

Answer 1

如果您要解决的主要问题是不想依次调用getData()和getCurrentDate()，那么您可能想要执行类似的操作。

async initializeApp() {
    this.presentLoading();
    await Promise.all([
        this.getData();
        this.getCurrentDate();
    ])
    await this.loading.dismiss();
  }

This answer很好地解释了Promise.all()的工作方式。

在这种情况下，您实际上并不需要await this.loading.present()和this.loading.dismiss()。