Bug: ChangeDetector over HttpErrorHandler

[Zetanova]

If an message gets queued in the the angular ErrorHandler.handleError(error: any) method, the notification will not get rendered until some other page change.

Workaround: To display the message instantly a force change detection can be triggered with (<any>this.notifierContainer).changeDetector.detectChanges();

export class AppComponent implements OnInit {
  @ViewChild(NotifierContainerComponent) notifierContainer!:NotifierContainerComponent;

  ngOnInit(): void {
    this.errorService.errors$
      .subscribe(n => {
        this.notifier.show({
          type: 'error',
          message: n
        });
        (<any>this.notifierContainer).changeDetector.detectChanges();
      });
  }
}

[mvrueden]

I stumbled upon the same issue and found a fix on the Angular2-Toaster project page. They describe that you should run the call within an ngZone.run(...) block.

export class AppErrorHandler implements ErrorHandler {
    constructor(
        private toasterService: ToasterService,
        private ngZone : NgZone) { }

    handleError(error: any): void {
        this.ngZone.run(() => {
            this.toasterService.pop('error', "Error", error);
        });  
    }
}

Source: https://github.com/stabzs/Angular2-Toaster#toasts-are-not-displayed-when-popped-from-an-error-handler

This should probably adapted slightly and just be added to the official documentation and we are good to go.