Get toast notifications up and running in less than a minute with NgLimeade! No joke!
Before installing NgLimeade, install the following Font Awesome dependencies:
$ npm install @fortawesome/angular-fontawesome$ npm install @fortawesome/fontawesome-svg-core$ npm install @fortawesome/free-regular-svg-icons$ npm install @fortawesome/free-solid-svg-icons
$ npm install ng-limeade
ToastFactoryService into your root
AppModule, and add the
NgLimeadeModule to the imports array.
limeade-toast-factory component to the top-level component ( in this case,
app-root ) to ensure that toasts persist between routes.
ToastFactoryService into your component and call the
showToast function to trigger a new toast in your application.
If you do not pass any configuration into the
showToast function, a toast of type
success will be created. For information on how to configure and create different types of toasts, see the Configuration section below.
While NgLimeade was created to allow you to incorporate toast notifications in your application with minimal setup, the library provides many configuration options that will allow you to cater notifications to your needs.
Types of Toasts
There are four types of toasts currently available in NgLimeade:
Creating a Toast
'ng-limeade' and create a new object of type
ToastInterface and set your configuration settings.
Pass the variable into the
showToast function to display a new toast in your application.
|type||'success', 'info', 'warning', or 'error'||'success'||Used to determine the type of toast to be created as well as the icon to be used|
|title||string||'Success!'||The title to be shown inside the toast. The color is determined by the type of toast|
|description||string||null||The description displays below the title and can consist of multiple lines of text|
|iconName||string||'check'||The Font Awesome icon name to be displayed inside the toast|