Angular 7 Service - неопределенное исключение

Question

Я новичок в угловых и пытаюсь управлять ошибкой http с помощью PrimeNg Toast .Я создал службу, которая выполняет http-вызов:

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

  apiEnv = environment.apiBase;
  constructor(private http: HttpClient, private handleError : HandleErrorService) { }

  getAtti() {
    return this.http.get<ApiResult<Atto[]>>(this.apiEnv + "Atti")
    .pipe(
      retry(3), // retry a failed request up to 3 times
      catchError(this.handleError.handleError) // then handle the error;
    );
  }
}

HandleErrorService:

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

  constructor(private toastService: ToastService) { }

  public handleError(error: HttpErrorResponse) {
    if (error.error instanceof ErrorEvent) {
      // A client-side or network error occurred. Handle it accordingly.
      console.error('An error occurred:', error.error.message);
    } else {
      this.toastService.addSingle;
      // The backend returned an unsuccessful response code.
      // The response body may contain clues as to what went wrong,
      console.error(
        `Backend returned code ${error.status}, ` +
        `body was: ${error.error}`);
    }
    // return an observable with a user-facing error message
    return throwError(
      'Something bad happened; please try again later.');
  };
}

Как вы можете видеть с помощью this.toastService.addSingle;, я вызываю службу тостов:

@Injectable({
  providedIn: 'root',
})

export class ToastService {

  constructor(private messageService: MessageService) { }

  addSingle() {
    this.messageService.add({severity:'success', summary:'Service Message', detail:'Via MessageService'});
  }
}

Компонент toast находится в app.component.html

<app-header></app-header>
<app-tab></app-tab>
<app-toast position="top-rigth"></app-toast>

Сервис внедряется провайдерами в app.module

@NgModule({
  providers:[HandleErrorService, MessageService, ToastService],

, но я получаю

ERROR TypeError: Cannot read property 'addSingle' of undefined
    at CatchSubscriber.push../src/app/service/handle-error.service.ts.HandleErrorService.handleError [as selector] (handle-error.service.ts:18)

Можете ли вы помочь мне? Спасибо

Answer 1

  catchError(this.handleError.handleError) // then handle the error;

Использование этой строки приводит к изменению контекста ключевого слова this.

Замените его одним из этих

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

Answer 2

addSingle это метод

  this.toastService.addSingle();