Menu
Currently, I just call toastr.success('my message') within a controller where required. This work fine, but it feels a bit dirty to me.
Is there a 'best practice' or recommended 'angularjs' way of using the toastr.js library?
299
ngx-toastr provides an option to add HTML code inside the toast message. To enable it to use HTML content inside the toast notification, you need to use the enableHtml option. Call the above message on click of the button and you will have the HTML content displayed inside the toaster notification.
Create an Angular project. To create a new project, open command prompt and add the following command to create the Toastr project. Open this project in Visual Studio Code. Now, go to View >Terminal and install Toastr into this project by using the following npm command.
Step 1:- First of all, create a new angular app. Now open your terminal and execute the following command on it to install the angular app. Then install NPM package called npm install ngx-toastr –save for implement toaster notification in angular 12 app. So, You can install the packages by executing the following commands in the terminal.
Typically module is a cohesive group of code which is integrated with the other modules to run your Angular 2 apps, all these modules are added in one common file i.e app.modules.ts , so we need to import ToastModule in it. this.toastr.success ('Successfully added customer.', 'Success!');
Let's have a look at how you can add a wrapper for ngx-toastr in your Angular application. Create an Angular service called notification, which you'll use in your application for showing the toastr message. In src/app create a folder called utility. Navigate to the utility folder and create an Angular service.
Yes. Pretty simply:
app.factory('notificationFactory', function () {
return {
success: function (text) {
toastr.success(text,"Success");
},
error: function (text) {
toastr.error(text, "Error");
}
};
});
Resolve factory in controller. Customize messages, notifications/etc in factory.
Despite the idea that code adds another abstraction, it's really effective.
179
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
