时间戳

首页 > 解决方案 > 如何使用离子加载事件“ionLoadingWillPresent”？

angular - 如何使用离子加载事件“ionLoadingWillPresent”？

问题描述

那里。我想知道如何在离子加载的 Ionic V4 中使用事件“ionLoadingWillPresent”。

我知道 IonLoading 是一个接口，这里是源代码：

interface IonLoading extends JSXBase.HTMLAttributes<HTMLIonLoadingElement> {
//...
   'onIonLoadingWillPresent'?: (event: CustomEvent<void>) => void;
//...
}

这是一个接口。

这是我的代码：

  constructor(
    public loadingController: LoadingController,
    public ionLoading: HTMLIonLoadingElement
  ) {}

  async triggerLoading() {
    const loading = await this.loadingController.create({
      message: '',
      duration: 2000,
      backdropDismiss: false,
      showBackdrop: false,
      spinner: 'dots',
      translucent: false,
    });
    // Here is my try, I use getTop methods to get the Ion-Loading Elements.
    this.ionLoading = await this.loadingController.getTop();

    this.ionLoading.onIonLoadingWillPresent = ()=> {
      console.log('hello')
    };
    // events
    await loading.present();
    await loading.onDidDismiss();
    console.log('loading is didmissed!');
  }

- 更新：

    this.loadingController.getTop().then(res => {
      res.addEventListener('ionLoadingWillPresent', (event: any) => {
        // no console from this code
        console.log(event);
      });
    });

--

onIonLoadingWillPresent但是，小弟，ionLoading没有属性，这个事件怎么用呢？

此类事件如：

ionLoadingDidDismiss, ionLoadingDidPresent, ionLoadingWillDismiss, ionLoadingWillPresent.

在页面上：离子加载 Api

我想知道如何使用这些事件。非常感谢。

PS：不是组件已经拥有的onDidDismiss方法。onWillDismission-loading-controller

标签： angularionic4

解决方案

我认为您可以像这样订阅事件：

this.ionLoading.addEventListener('ionLoadingWillPresent', (event: any) => {
});

如果这不能解决问题，那么我不确定您获得 ionLoading 参考的方式是否正确，但我需要为此找到一个代码片段。

推荐阅读