Error handling with Observables in Angular 2

Question

I'm trying to pass any errors that might occur in an HTTP request to a common logging service from all my services:

import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/catch';

constructor(logger: LoggerService) { }

doSomething(): Observable<any> {
    return this.http
        .post('/foo/bar', {})
        .catch(this.notifyErrors);
}

protected notifyErrors(error: any): Observable<any> {
    this.logger.log(error);

    return Observable.throw(error);
}

Unfortunately, inside the notifyErrors method, this is lost. I've tried defining this as a fat arrow, but i get type errors from the TS compiler. I've used the exact syntax in the Observable documentation.

Gunter, has a more elegant solution. I like his better than mine. — Mardok
– Mardok, Commented Mar 29, 2017 at 16:42

Günter Zöchbauer · Accepted Answer · 2017-03-29 16:38:02Z

8

If you pass function references, you need to fix this

 .catch(this.notifyErrors.bind(this));

or alternatively

 .catch(() => this.notifyErrors());

See also https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions

answered Mar 29, 2017 at 16:38

Günter Zöchbauer

661k235 gold badges2.1k silver badges1.6k bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Mardok · Accepted Answer · 2017-03-29 17:04:17Z

-1

I have not run your code, but if you want to access this, you may have to pass it in.

import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/catch';

constructor(logger: LoggerService) { }

doSomething(): Observable<any> {
    return this.http
        .post('/foo/bar', {})
        .catch(err => {
            this.notifyErrors(err, this);
        });
}

protected notifyErrors(error, that): Observable<any> {
    that.logger.log(error);
    return Observable.throw(error);
}

edited Mar 29, 2017 at 17:04

answered Mar 29, 2017 at 16:40

Mardok

1,46013 silver badges17 bronze badges

2 Comments

vinnylinux Over a year ago

err => { this.notifyErrors(err, this); } does not work. The compiler gives me: Argument of type '(err: any) => void' is not assignable to parameter of type '(err: any, caught: Observable<Response>) => ObservableInput<{}>'.

Mardok Over a year ago

Or Use Gunters answer.

Collectives™ on Stack Overflow

Error handling with Observables in Angular 2

2 Answers 2

Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related