Angular 7 - введенный сервис всегда нулевой

Question

У меня есть приложение Angular 7. Я создал сервис, который реализует HttpInterceptor. Вот код, за вычетом импорта

@Injectable({
  providedIn: 'root'
})
export class InterceptorService implements HttpInterceptor {

  constructor(private errorLoggingService:ErrorLoggingService) {

  }

  handleError(error: HttpErrorResponse) {    
    this.errorLoggingService.logErrorData(error);
    return throwError(error);
  }

  //configure the interceptor
  intercept(req: HttpRequest<any>, next: HttpHandler):Observable<HttpEvent<any>> {
    return next.handle(req)
      .pipe(
        catchError(this.handleError)
      )
  };
}

Цель здесь - отловить ошибки Http (от вызова серверных служб) и записать их в экземпляр errorLoggingService. Класс ErrorLoggingService определен так:

@Injectable({
    providedIn: 'root'
})
export class ErrorLoggingService {

    constructor(private httpClient:HttpClient) {

    }

    //logs the error to the nodeJS endpoint
    public logErrorString(error:string)
    {

    }

    public logErrorData(error:any) {

    }

}

Моя проблема в том, что в функции handleError () this.errorLoggingService не определено, поскольку this указывает на Observable (я думаю) из-за способ наблюдения наблюдаемых в методе перехвата.

Как я на самом деле ссылаюсь на мои переменные класса или что-то еще в области видимости класса, здесь? Или как передать errorLoggingService методу handleError? Это было бы тоже хорошо.

Answer 1

Это undefined, потому что при передаче ссылки на функцию, context теряется. Его context перестает ссылаться на экземпляр InterceptorService.

. Вам необходимо либо явно связать context

catchError(this.handleError.bind(this))

, либо вызвать его в функции стрелки, сохранив его

catchError(err => this.handleError(err))