Reactive-Extensions / RxJS

The Reactive Extensions for JavaScript
http://reactivex.io
Other
19.49k stars 2.1k forks source link

.Catch does not have reference to this #1408

Open fkolar opened 7 years ago

fkolar commented 7 years ago

I am not sure whether I have something wrong here, but instead of having reference to THIS of current object inside my catch the THIS refers to CatchSubscriber ?

      this.interceptBefore(url, options);
        return super.get(url, options)
            .catch((err: any): any =>
            {
                console.log(' ERROR: ' + err);
                if (err.status === 400 || err.status === 422) {
                    return Observable.throw(err);
                } else {
                    this.errorService.notifyError(err);
                    return Observable.empty();
                }
            })
            .retryWhen(error => error.delay(this.retryInterval))
            .timeout(this.abortTimeout)
            .finally(() =>
            {
                this.interceptAfter();
            });
paulpdaniels commented 7 years ago

Are you running this through a transpiler? this should refer to the captured scope since it is inside a fat arrow function. Do you have a larger context you can share?

Also you might get a better response if you ask on SO instead since this seems to be a JavaScript issue, not particular to Rx

fkolar commented 7 years ago

This is what I am expecting as well and Arrow functions works for me like this.

The context is I am extending Angular's HTTP service to override their method request, get, ... to add some Interceptor capabilities so I can be flexible in terms of shaping Request itself. And one of the method I am using for this specific thing is request

request(url: string | Request, options?: RequestOptionsArgs): Observable<any>
    {
        this.interceptBefore(url, options);
        let currentErrorHandler = this.errorService;
        return super.request(url, options)
            .catch((err: any): any =>
            {
                if (err.status === 400 || err.status === 422) {
                    return Observable.throw(err);
                } else {
                    currentErrorHandler.notifyError(err);
                    return Observable.empty();
                }
            })
            .retryWhen((error: any) =>
            {
                return error.delay(this.retryInterval)
            })
            .timeout(this.abortTimeout)
            .finally(() =>
            {
                this.interceptAfter();
            });
    }

And when I call it to get some HTTP resource and subscribe to it the above method is called and instead of having my this I get above wrong this refering to above CatchSubscriber context

this.http.get(localizedUrl)
                .subscribe((res: Response) =>
                {
.....
                    }
                });
aluanhaddad commented 7 years ago

I've written a very similar class and I've not experienced the issue. I don't understand what this has to do with the CatchSubscriber context regardless. Since you are using arrow functions, you should not have the wrong this.