[SOLVED] Toaster not hiding

Toaster not hiding - Angular 5

I am using angular2-toaster but I am having issues ONLY on this project. I used it on multiple projects before and it works fine, but when I switched to angular 5 version I cannot get the toaster message to disappear. On success or error, I have a timeout which should hide the message, however it doesn't happen. This is my toaster config, if anyone had the same issue recently let me know, thanks!

if (showSuccessToast) {
        const toast: Toast = {
          type: 'success',
          title: 'Well Done !',
          body: toastMessage ? toastMessage : 'Operation successful.',
          showCloseButton: true,
          timeout: 2000,
          closeHtml: '<div class="toaster-close-icon"></div>'
        };

        this.toasterService.pop(toast);
      }

Solution

As I can see in the documentation there is a point: Version ^ 5.0.0 requires either .forRoot() or .forChild() ToasterModule inclusion.

Could you try to add .forRoot() for ToasterModule? forRoot guarantees that you create service instances only once. So it might solve your problem