同步后不会隐藏离子刷新器

Question

我只是在项目中设置了离子刷新器，它可以完美加载数据，但是在完成功能后不会隐藏

home.html

<ion-refresher slot="fixed" pullingIcon="arrow-dropdown"
      pullingText="Pull to refresh"
      refreshingSpinner="circles"
      refreshingText="Refreshing..." (ionRefresh)="doRefresh($event)">
    <ion-refresher-content></ion-refresher-content>
  </ion-refresher>

home.ts

  doRefresh(event) {
    console.log('Begin async operation');
    this.data.getTodayReservations().subscribe(
        reservations => {
            console.log(reservations);
            this.reservations = reservations;
        }, error => {
            console.log(error);
        });
    setTimeout(() => {
      console.log('Async operation has ended');
    }, 2000);
  }

控制台：

Begin async operation
(3) [{…}, {…}, {…}]
Async operation has ended

但是在触发刷新事件后，数据加载完毕，但是刷新像该图像一样停留在顶部

Answer 1

数据更新后，您需要在doRefresh中调用event.complete();。

doRefresh(event) {
    console.log('Begin async operation');
    this.data.getTodayReservations().subscribe(
        reservations => {
            console.log(reservations);
            this.reservations = reservations;
            event.complete();//here
        }, error => {
            console.log(error);
        });
    setTimeout(() => {
      console.log('Async operation has ended');
    }, 2000);
  }

API docs for Ionic 3

Answer 2

在离子4/5中，使用event.target.complete（）