$ bower install ng-foobar --save- Include both ng-foobar.js and ng-foobar.css in your website.
<script src="bower_components/ng-foobar/ng-foobar.js"></script>
<link rel="stylesheet" href="bower_components/ng-foobar/ng-foobar.css">- Set ngFoobar as a dependency in your module
var app = angular.module('myApp', ['ngFoobar']);- Inject ngFoobar provider in controller
var MyCtrl = function($scope, $timeout, ngFoobar) {}Use with the API down below.
- show(context, message) - Display message in the screen
- context -
[string]"success"',"error","warning"or"info" - message -
[string]The message to be displayed
ngFoobar.show("success", "Hi, I'm a successful notification message");- setAutoClose(autoClose, displayTime) - Enable/disable notification auto close
- autoClose -
[boolean]Whether to auto close the notifications or not (default value isfalse) - displayTime -
[number]The display duration in milliseconds (default value is3000)
ngFoobar.setAutoClose(true, 5);- setColors(context, colors) - Change the colors of a specific context
- context -
[string]"success"',"error","warning"or"info" - colors -
[object]color,backgroundandborder- new color values
ngFoobar.setColors("success", {color: "#3C763D", background: "#DFF0D8", border: "#D6E9C6"});- resetColors() - Resets all colors for all contexts to their default values
ngFoobar.resetColors();- setOpacity(opacity) - change the opacity to the specified value
- opacity -
[number]The desired opacity value for the notification bar (default is0.9)
ngFoobar.setOpacity(0.8);A working demo can be found at http://ng-foobar.herokuapp.com/
MIT