angulartypescriptngx-toastr

Ngx-toastr - Set global config for specific toast


Is there any way to set global settings for individual toast config? I want to set this config only to error toast:

{
  timeOut: 0,
  extendedTimeOut: 0,
  closeButton: true
}

I know that I can pass those settings to individual toast like

this.toastService.error('ERROR', config)

But adding custom config to every error() call is really inconvenient. Is there a way to set those settings for error in some global config?


Solution

  • You can create a wrapper service and override the default values.

    import { Injectable } from '@angular/core';
    import { ActiveToast, IndividualConfig, ToastrService } from 'ngx-toastr';
    
    @Injectable({
      providedIn: 'root',
    })
    export class CustomToastrService {
      constructor(private toastr: ToastrService) {}
    
      error(
        message?: string,
        title?: string,
        override?: Partial<IndividualConfig>
      ): ActiveToast<any> {
        override = {
          timeOut: 0,
          extendedTimeOut: 0,
          closeButton: true,
          ...override,
        };
        return this.toastr.error(message, title, override);
      }
    }