Friday, 15 May 2015

ngNotify in angularjs

ng-notify:-

 A simple, lightweight module for displaying notifications in your AngularJS app.


Implementation:-

 

a)Requirements

AngularJS is the only dependency. Animation is achieved with pure JS, jQuery not necessary.


b)Installation

You can install ng-notify with Bower.


 bower install ng-notify --save



c)Usage

After including ng-notify.min.js and ng-notify.min.css, inject the ng-notify provider into your project.

var app = angular.module('demo', ['ngNotify']);
 
Now you can trigger notifications from anywhere in your app. To display a notification, just use the set method.

ngNotify.set('Your notification message goes here!');
 
To specify the type of notification to display, provide the optional type param. (For available types, check the definitions below.)
ngNotify.set('Your error message goes here!', 'error');
 
 
 

Advanced Usage:-

a)Default Configuration

You can override the default options for all notifications by using the config method. None of these options are required. (For available options, check the definitions below.)
ngNotify.config({
    theme: 'pure',
    position: 'bottom',
    duration: 3000,
    type: 'info',
    sticky: false
});


b)Individual Configurations

You can also pass an object of options to individual notifications. You can pass through any combination of our available options here as well. (For available options, check the definitions below.) For example:

 ngNotify.set('Your first message.', {
    position: 'top',
    sticky: true
});

ngNotify.set('Your second message.', {
    type: 'error',
    duration: 2000
});

ngNotify.set('Your third message.', 'error'); // Original use case still works, too.

ngNotify.set('Your fourth message.', {
    theme: 'pitchy'
});


5 comments: