Finalize operator not called when wrapped

Question

I am using a angular service to wrap some of my http calls in order to manage the loading state of my application.

This service stores the status of the calls for further process. Unfortunately the finalize function is never called.

Here is the wrapper:

searchWithLoader(obs: Observable<any>) {
   this.show();
   obs.pipe(finalize(() => {
      console.log("FINALIZE NOT CALLED");
      this.hide();
   }));

   return obs;
}

And the way I typically call it :

   let performanceLoader = this.loaderService.searchWithLoader(
      this.performanceDataService.getSomething({
        x: x,
        y: y,
      }));

    performanceLoader.subscribe(() => {});

Is there a way around this in order for the finalize to be called in a service instead of the component?

William Stevens · Accepted Answer · 2019-10-03T16:33:26.637

4

When you call the pipe function of the obserable it doesn't mutate the observable. Instead, it returns a new observable. So you should set obs to obs.pipe() like below

searchWithLoader(obs: Observable<any>) {
   this.show();
   return obs.pipe(finalize(() => {
      console.log("FINALIZE NOT CALLED");
      this.hide();
   }));      
}

edited Oct 03 '19 at 16:33

answered Oct 03 '19 at 15:18

William Stevens

514
6
9

You could even just return obs.pipe() and remove the return line at the bottom. – Keenan Diggs Oct 03 '19 at 15:40

score 1 · Answer 2 · answered Oct 03 '19 at 15:15

1

Your code

 this.performanceDataService.getSomething({
        x: x,
        y: y,
      }))

It's not an observable, it need to be an observable when you pass it to the searchWithLoader function. UNLESS you can show the code fo the getSomething we can help you more

answered Oct 03 '19 at 15:15

Patricio Vargas

5,236
11
49
100

getSomething is a API call generated by a raml file so you can 100% consider it as an observable – Maxime Dauvergne Oct 03 '19 at 18:03

Finalize operator not called when wrapped

2 Answers2