Ion-refresher question

Ionic Framework ionic-v3
1

Hi,

I have inside my class a function called “refresh()” and inside, I have an Observable.forkJoin().

I am using that function when going to that page.

I want to use that function also when using the ion-refresher. When the (refresh) event happens, I will call “refresh()”, but I want to stay there until the forkJoin (http requests) is terminated.

How would you deal with the case?

Thanks

2

Hi there, any suggestions?

3

Can you provide a bit more code so I have a fuller idea of how you are handling your observable?

4

Does the below is enough to explain?

  onPageLoaded() {
    this.refresh();
  }

  refresh() {
    Observable.forkJoin(
      this._service1.retrieveData(),
      this._service2.retrieveData(),
      this._service3.retrieveData()
    ).subscribe(
      data => {
       ...
  }

  doRefresh(refresher) {
    this.refresh();

    // this is what I would like to modify to handle the end of the this.refresh()
    setTimeout(() => {
      console.log('Pull to refresh complete!', refresher);
      refresher.complete();
    })
  }
5

Here what I’ve done. Probably can be optimized or done differently. I am opened for other suggestions

  onPageLoaded() {
    this.refresh();
  }

  refresh() {
    return new Promise((resolve, reject) => {
      Observable.forkJoin(
        this._service1.retrieveData(),
        this._service2.retrieveData(),
        this._service3.retrieveData()
      ).subscribe(
        data => {
         ...
    });
  }

  doRefresh(refresher) {
    this.refresh().then((success) => refresher.complete(), (error)=> refresher.complete());

  }
6

Are you using beta2? They updated refresher in beta 2.

7

I’m a little confused about what you’re trying to do overall. If you’re just wanting to block an action until all refresh events have completed you could create a variable to watch the active events. If I’m not understanding correctly, try to clarify and I’ll look back at it. Here is a jsbin with a possible implementation

8

Hi @swarner,

I want the ion-refresher to stay there until the subscribe is completed.

I found that the Promise help me to fix that. I don’t want to use a setTimeout like their example because I don’t know when the update/refresh will be completed.

With your suggestion of a variable to watch, how would you handle it with the (refresh) event?

9

If you want to know whether you can transition, just query the variable. If you want to know when there are no refresh events still being processed, you could create a subject to watch the variable. See this jsbin example.

Note that you will probably want to use AsyncSubject rather than the standard Subject, so you can be notified of the last value if you subscribed late.