You signed in with another tab or window.Reload to refresh your session.You signed out in another tab or window.Reload to refresh your session.You switched accounts on another tab or window.Reload to refresh your session.Dismiss alert
And when you need to show notifications, inject service and call it!
angular.module('notificationTest').controller('notificationController',function($scope,Notification){Notification.primary('Primary notification');// or simply..Notification('Primary notification');// Other Options// SuccessNotification.success('Success notification');// Message with custom typeNotification({message:'Warning notification'},'warning');// With TitleNotification({message:'Primary notification',title:'Primary notification'});// Message with custom delayNotification.error({message:'Error notification 1s',delay:1000});// Embed HTML within your message.....Notification.success({message:'Success notification<br>Some other <b>content</b><br><a href="https://github.com/alexcrack/angular-ui-notification">This is a link</a><br><img src="https://angularjs.org/img/AngularJS-small.png">',title:'Html content'});// Change position notificationNotification.error({message:'Error Bottom Right',positionY:'bottom',positionX:'right'});// Replace messageNotification.error({message:'Error notification 1s',replaceMessage:true});}
Service
Module name: "ui-notification"
Service: "Notification"
Configuration provider: "NotificationProvider"
Options
Options can be passed to configuration provider globally or used in the current message.
The options list:
Option
Possible values
Default value
Description
delay
Any integer value
5000
The time in ms the message is showing before start fading out
startTop
Any integer value
10
Vertical padding between messages and vertical border of the browser
startRight
Any integer value
10
Horizontal padding between messages and horizontal border of the browser
verticalSpacing
Any integer value
10
Vertical spacing between messages
horizontalSpacing
Any integer value
10
Horizontal spacing between messages
positionX
"right", "left", "center"
"right"
Horizontal position of the message
positionY
"top", "bottom"
"top"
Vertical position of the message
replaceMessage
true, false
false
If true every next appearing message replace old messages
templateUrl
Any string
"angular-ui-notification.html"
Custom template filename (URL)
onClose
Any function
undefined
Callback to execute when a notification element is closed. Callback receives the element as its argument.
closeOnClick
true, false
true
If true, messages are closed on click
maxCount
Any integer
0
Show only [maxCount] last messages. Old messages will be killed. 0 - do not kill
priority
Any integer
10
The highier the priority is, the higher the notification will be
Also you can pass the "scope" option. This is an angular scope option Notification scope will be inherited from. This option can be passed only in the methods. The default value is $rootScope
Methods
Notification service methods
Method name
Description
Notification(), Notification.primary()
Show the message with bootstrap's primary class
Notification.info()
Show the message with bootstrap's info class
Notification.success()
Show the message with bootstrap's success class
Notification.warning()
Show the message with bootstrap's warn class
Notification.error()
Show the message with bootstrap's danger class
Notification.clearAll()
Remove all shown messages
Notification service options
Option
Possible values
Default value
Description
title
String
""
Title to appear at the top of the notification
message
String
""
Message to appear in the notification
templateUrl
String
"angular-ui-notification.html"
URL of template to be used for notification
delay
Int (?)
5000 or configured global delay
Number of ms before notification fades out. If not an integer, notification will persist until killed.
type
"primary", "info", "success", "warning", "error"
"primary"
Bootstrap flavoring
positionY
"top", "bottom"
"top"
positionX
"right", "left", "center"
`"right"
replaceMessage
Boolean
false
If true this message will replace old(er) message(s)
closeOnClick
true, false
true
If true, the message is closed on click
Returning value
Every "show" method returns a promise that resolves a notification scope with these methods:
Method name
Description
notificationScope.kill(isHard)
Remove the specific message isHard - if false or omitted kill message with fadeout effect (default). If true - immediately remove the message
