阻止按钮双击ionic2

Question

我正在使用ionic2应用程序中的一个按钮，并使用(单击)。但是如果我按两次按钮，相同的功能(假设打开一个模式)会显示两次。当按钮加载异步功能时，我们如何防止双击或附带的多次单击。我希望有一些dblclick事件，只是防止它，但我不认为ionic2有这一点。我试过使用(点击)，但它也接受多次点击。

在使用异步调用时，我是否需要处理此手动/自定义操作，并将布尔值设置为true和false，并将其用作disabled属性？

Answer 1

您可以使用loading组件来实现这一点。

import { LoadingController } from 'ionic-angular';

export class Util {
  public progressBarLoader : any;
  constructor(public loadingCtrl: LoadingController) {
  }

  showLoader(timeInMilliseconds) {
    let progressBarLoader = this.loadingCtrl.create({
      content: "Please wait...",
      duration: timeInMilliseconds
    });
    progressBarLoader.present();
  }

  hideLoader(){
    try{
      if(this.progressBarLoader != null || this.progressBarLoader != undefined){
        this.progressBarLoader.dismiss();
      }
    }catch(e){      
      console.log("Busy Indecator not showing :: " + e.message);
    }
  }
}

当点击按钮时，调用具有很长时间值的showLoader()，当您的异步操作完成时，您可以调用hideLoader()。这将避免多次点击该按钮，并且您不必手动启用/禁用该按钮。