Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

RXJS Observable doSomething onComplete

I would like to use the RXJS Observable. Basically it works fine, but I need not just to react when observer.next() but also when observer.complete() is called. How do I get the event of OnComplete of an RXJS Observable? In my opinion the RXJS doc is confusing.

export class Service {
    myMethod():Observable<any> {
        return Observable.create((observer:any) => {
        for(let i=0; i<10; i++) {
         observer.next(i);
        }
        if(true==true) {
            // this event I need
            observer.complete();
        } else {
            observer.error(xhr.response);
        }
    }
}

export class Component() {
    // constructor etc.

    doSome() {
        this.service.myMethod()
        // Here I would like to get OnComplete event
          .catch(this.handleError)
          .subscribe((num:any) => {
            console.log(num);
        });
    }
}
like image 630
Johannes Avatar asked Jul 05 '16 13:07

Johannes


People also ask

How do you end an observable?

Use the unsubscribe method A Subscription essentially just has an unsubscribe() function to release resources or cancel Observable executions. To prevent this memory leaks we have to unsubscribe from the subscriptions when we are done with. We do so by calling the unsubscribe method in the Observable.

Does observable complete unsubscribe?

Note that when an observable emits a complete event, subscriptions will automatically be unsubscribed, and that certain frameworks using RxJS may also handle unsubscriptions automatically in certain cases. In all other cases, we must handle unsubscribing ourselves.

How do I subscribe to an observable?

Subscribinglink An Observable instance begins publishing values only when someone subscribes to it. You subscribe by calling the subscribe() method of the instance, passing an observer object to receive the notifications. Returns an Observable instance that synchronously delivers the values provided as arguments.

What is Take operator in RxJS?

take returns an Observable that emits only the first count values emitted by the source Observable. If the source emits fewer than count values then all of its values are emitted. After that, it completes, regardless if the source completes.


2 Answers

The subscribe method accepts three callbacks. The last one is for the complete event.

doSome() {
  this.service.myMethod()
      .subscribe((num:any) => {
        console.log(num);
      }, (err) => {
        this.handleError(err);
      }, () => { // <----
        this.handleComplete();
      });
}

You could also leverage the finally operator for this.

doSome() {
  this.service.myMethod()
      .catch(this.handleError)
      .finally(this.handleComplete) // <----
      .subscribe((num:any) => {
        console.log(num);
    });
}

note: there is a difference between the two examples in case we have errors: if we would add console.logs we would see that in the first case only handleError is printed

-> handleError

in the second case

-> handleError
-> finally

in other words finally is always called, were complete is not.

like image 184
Thierry Templier Avatar answered Oct 12 '22 02:10

Thierry Templier


As Thierry Templier answered one option is to leverage the finally/finalize (rxjs docs) (but it's not the same as using the complete event, see the notes)


last

Another option to do something on complete is last (rxjs/last)

enter image description here

like image 45
Natan Braslavski Avatar answered Oct 12 '22 02:10

Natan Braslavski