Интегрируйте функцию «тянуть-обновить» в Ionic 3 с Wordpress

Question

Я работаю над приложением Ionic3, интегрированным с Wordpress с использованием REST API v2, и мне нужно включить функцию pull to refresh , но я не понимаю, как это сделать с моим кодом.

Это моя функция, которая извлекает мое сообщение

getPostsWordpress(){
    if(!(this.posts.length > 0)){
      let loading = this.loadingCtrl.create();
      loading.present();
      this.wordpressService.getRecentPostsWithSort(this.categoryId,this.sort) 
      .subscribe(data => {
        for(let post of data){
          post.excerpt.rendered = post.excerpt.rendered.split('<a')[0] + "</p>";
          this.posts.push(post);
        }
        loading.dismiss();
      });
    }
  }

...

doInfinite(infiniteScroll) {
    let page = (Math.ceil(this.posts.length/10)) + 1;
    console.log("PAGE_"+page)
    console.log("this.posts.length_"+this.posts.length)
    let loading = true;

    this.wordpressService.getRecentPostsWithSort(this.categoryId,this.sort, page)
    .subscribe(data => {
      for(let post of data){
        if(!loading){
          infiniteScroll.complete();

        }
        post.excerpt.rendered = post.excerpt.rendered.split('<a')[0] + "</p>";
        this.posts.push(post);
        loading = false;
      }
    }, err => {
      this.morePagesAvailable = false; 
    }) 
  }  

doInfinite позволяет мне реализовывать бесконечную прокрутку, и все работает хорошо!

Как можно интегрировать pull для обновления из ионной документации?Это образец из документа, и я не понимаю, как я могу использовать его в своем проекте.

doRefresh(refresher) {
    console.log('Begin async operation', refresher);

    setTimeout(() => {
      console.log('Async operation has ended');
      refresher.complete();
    }, 2000);
  }

Кто-то может мне помочь?Заранее спасибо!

Answer 1

добавьте это к вашему html

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

, затем в вашем обновите

doRefresh(refresher) {
console.log('Begin async operation', refresher);
//ur function e.g getPostWordPress()
setTimeout(() => {
  console.log('Async operation has ended');
  refresher.complete();
}, 2000);}