Angular 4: Пользовательский errorHandler с Subject или BehaviorSubject не работает

Question

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

@Injectable()
export class GlobalErrorHandler implements ErrorHandler {
  constructor() { }
  errors: BehaviorSubject<any> = new BehaviorSubject(false);
   //errors: Subject<any> = new Subject();
  technicalError= false;
  handleError(error) {
        const httpCode = error.status;
         if (httpCode !== undefined) {
           this.errors.next(error._body);
           //this.technicalError = true;
         }else {
           console.log('Error--' + error);
           // throw error;
         }
        }

    }

Основные-component.ts

@Component{
 providers: {GlobalErrorhandler}
}
export class MainComponent {

constructor(private glbError:GlobalErrorHandler){
}

onInit(){
this.glbError.errors.subscribe({
body=> {
this.technicalErrors = body;
}
});
}

showError(){
 throw new error();//consider it as http error with 400 or 403, this is sample one
}
}

Здесь при ошибке, полученной от бэкэнда, он вызывает метод handleError, но он не отправляет сообщение об ошибке в MainComponent.

Обновленный вопрос также добавлен ниже строки в MainModule

providers: [{provide:ErrorHandler, useClass:GlobalErrorHandler}]

Answer 1

Предположим, что лучше не раскрывать полный объект объекта, как это

errors: BehaviorSubject<any> = new BehaviorSubject(false);

так должно быть

private errorsSubejct: BehaviorSubject<any> = new BehaviorSubject(false);

get errors():Observable<any> {
    return this.errorsSubject.asObservable();
}

---

ты можешь попробовать вот так

this.glbError.errors.asObservable().subscribe({
body=> {
this.technicalErrors = body;
}
});

поэтому ваш код будет таким, component.ts

@Component{
 providers: {GlobalErrorhandler}
}
export class MainComponent {

technicalErrors: any[];

constructor(private glbError:GlobalErrorHandler){
}

onInit(){
this.technicalErrors = [];
this.glbError.errors.asObservable().subscribe({
body=> {
this.technicalErrors = body;
}
});
}

showError(){
 throw new error();//consider it as http error with 400 or 403, this is sample one
}
}

component.html

<div *ngFor="let err of technicalErrors">
  {{err|json}}
</div>