NGX Growl is a module that displays growl like messages
- @angular/common
- @angular/core
- ngx.logger
npm install --save ngx-growl
Once installed you need to import our main module:
import {GrowlModule} from 'ngx-growl';
The only remaining part is to list the imported module in your application module, passing in a config to intialize the logger.
@NgModule({
declarations: [AppComponent, ...],
imports: [GrowlModule.forRoot({maxMessages: 10, displayTimeMs: 5000}), ...],
bootstrap: [AppComponent]
})
export class AppModule {
}
- maxMessages - The maximum number of messages allowed to be displayed at a time
- displayTimeMs - The time a message will display before being automatically hidden in milliseconds
To use NGX Growl, you will need to add it to your an application html file
<ngx-growl></ngx-growl>
Import the service
import {GrowlService} from 'ngx-growl';
Intect the service
constructor(private growlService: GrowlService) { }
Then call one of the methods
this.growlService.addError(`You're Error message goes here`);
this.growlService.addError({heading: 'Oops', message: 'an error has occured'});