Question

在我的应用程序中，我有一些区域可以触发异步服务调用。因此，当用户执行某些阻塞操作时，我会显示一个loadingController实例。同时可以启动另一个异步调用，并且我再次提出另一个loadingController - 但是这个与另一个重叠 - 如果它们是标准加载器但是它们具有透明背景则不是问题。

在先前版本的离子中，控制器彼此不重叠。

我错过了什么吗？

Answer 1

因此，如果你看下面离子3文档中的例子，你会发现他们将loadController分配给var'loading'，然后调用它以稍后关闭加载器（loading.dismiss（））。

presentLoadingDefault() {
  let loading = this.loadingCtrl.create({
    content: 'Please wait...'
  });

  loading.present();

  setTimeout(() => {
    loading.dismiss();
  }, 5000);
}

为了防止堆叠行为，您可以简单地在核心组件或提供程序级别使用变量，而不是在presentLoadingDefault（）方法的执行上下文中，并检查方法中的加载程序是否已打开。

以下是我在“loadingProvider”中使用它的方法：

import { Injectable } from '@angular/core';
import { LoadingController } from 'ionic-angular';

@Injectable()
export class LoadingProvider {

    public loading = null;

    constructor (
        private loadingCtrl: LoadingController
    ) {
    }

    presentLoader() {
        // this below will prevent "stacking" as long as we treat this.loading as a single source of truth for any loader:
        if (this.loading) {
            this.loading.dismiss();
            this.loading = null;
        }
        // the rest is as usual
        this.loading = this.loadingCtrl.create({
            content: 'Please wait...'
        });
        this.loading.present();
        setTimeout(() => {
            loading.dismiss();
        }, 5000);
    }
}

如何防止Ionic 3 LoadingController堆叠

1 个答案: