Ionic 4:“加载控制器"dismiss() 在 present() 之前被调用，这将保持微调器而不解除

本文介绍了Ionic 4:“加载控制器"dismiss() 在 present() 之前被调用，这将保持微调器而不解除的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

限时送ChatGPT账号..

我使用Ionic Loading Controller"来显示一个微调器，直到数据被检索到然后它调用dismiss()"来关闭它.它工作正常，但有时当应用程序已经有数据时，dismiss()"在create()"和present()"完成之前被调用，这将使微调器不关闭...

I used "Ionic Loading Controller" to show a spinner until the data is retrieved then it calls "dismiss()" to dismissed it. it works fine, but sometimes when the app already have the data, the "dismiss()" is called before the "create()" and "present()" is done which will keep the spinner without dismissing...

我试图调用loadingController.present().then()"中的数据，但这导致数据变慢...

I tried to call the data inside "loadingController.present().then()", but that caused the data to be slower...

这是一个错误吗?如何解决这个问题?

is this a bug? how to solve the this issue?

我的代码示例:

customer: any;

constructor(public loadingController: LoadingController, private customerService: CustomerService)

ngOnInit() {
  this.presentLoading().then(a => consloe.log('presented'));
  this.customerService.getCustomer('1')
  .subscribe(customer => {
    this.customer = customer;
    this.loadingController.dismiss().then(a => console.log('dismissed'));
  }
}

async presentLoading() {
  const loading = await this.loadingController.create({
    message: 'wait. . .',
    duration: 5000
  });
  return await loading.present();
}

推荐答案

这就是我解决问题的方式..

this is how I solved my issue..

当调用dismiss() 时，我使用布尔变量isLoading"更改为false.present() 完成后如果isLoading" === false(意味着dismiss() 已经调用)那么它会立即关闭.

I used a boolean variable "isLoading" to change to false when dismiss() is called. after present() is finished if "isLoading" === false (means dismiss() already called) then it will dismiss immediately.

此外，我在服务中编写了代码，因此我不必在每个页面中再次编写.

also, I wrote the code in a service so I don't have to write it again in each page.

loading.service.ts

loading.service.ts

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

@Injectable({
  providedIn: 'root'
})
export class LoadingService {

  isLoading = false;

  constructor(public loadingController: LoadingController) { }

  async present() {
    this.isLoading = true;
    return await this.loadingController.create({
      // duration: 5000,
    }).then(a => {
      a.present().then(() => {
        console.log('presented');
        if (!this.isLoading) {
          a.dismiss().then(() => console.log('abort presenting'));
        }
      });
    });
  }

  async dismiss() {
    this.isLoading = false;
    return await this.loadingController.dismiss().then(() => console.log('dismissed'));
  }
}

然后从页面调用present()和dismiss().

then just call present() and dismiss() from the page.

有问题的例子:

customer: any;

constructor(public loading: LoadingService, private customerService: CustomerService)

ngOnInit() {
  this.loading.present();
  this.customerService.getCustomer('1')
  .subscribe(
    customer => {
      this.customer = customer;
      this.loading.dismiss();
    },
    error => {
      console.log(error);
      this.loading.dismiss();
    }
  );

这篇关于Ionic 4:“加载控制器"dismiss() 在 present() 之前被调用，这将保持微调器而不解除的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！