An Angular module that gives you a way to share messages among modules.
Just as you would do with $on, $emit and $broadcast using AngularJS, you can easily register your listeners and execute them with this simple service. Angular Communicator brings you an awesome feature that allows you define your listeners as a tree and execute them as you wish, nice and easy.
(1) You can install angular-communicator using 3 different ways:
Git:
clone & build this repository
Bower:
$ bower install angular-communicator --savenpm:
$ npm install angular-communicator(2) Include angular-communicator.js (or angular-communicator.min.js) from the dist directory in your index.html, after including Angular itself.
(3) Add 'AngularCommunicator' to your main module's list of dependencies.
When you're done, your setup should look similar to the following:
<!doctype html>
<html ng-app="myApp">
<head>
</head>
<body>
...
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.min.js"></script>
<script src="bower_components/js/angular-communicator.min.js"></script>
...
<script>
var myApp = angular.module('myApp', ['AngularCommunicator']);
</script>
...
</body>
</html>Register a listener with its callback function.
myApp.controller('MainCtrl', function($scope, angularCommunicatorService) {
//...
angularCommunicatorService.on('foo', function(obj) {
//...
});
//...
});You can build a tree of listeners adding ':' to specify the hierarchy.
myApp.controller('MainCtrl', function($scope, angularCommunicatorService) {
//...
angularCommunicatorService.on('foo', function(obj) {
//...
});
//...
angularCommunicatorService.on('foo:update', function(obj) {
//...
});
//...
angularCommunicatorService.on('bar:bee:save', function(obj) {
//...
});
});On returns a clear function to control when the listener needs to be removed.
myApp.controller('MainCtrl', function($scope, angularCommunicatorService) {
//...
var cleanUp = angularCommunicatorService.on('update', function(obj) {
//...
});
//...
cleanUp();
//...
});Execute all registered listeners.
myApp.controller('MainCtrl', function($scope, angularCommunicatorService) {
//...
angularCommunicatorService.exec('foo', {update: true});
//...
});You can execute the listeners of a level just telling the parent level name.
myApp.controller('MainCtrl', function($scope, angularCommunicatorService) {
//...
angularCommunicatorService.on('foo:bar', Bar());
angularCommunicatorService.on('foo:bee', Boo());
angularCommunicatorService.on('foo:bar:update', Update());
angularCommunicatorService.on('foo:bar:save', Save());
//...
angularCommunicatorService.exec('foo:bar', {update: true});
//...
});Execute multiple listeners at once.
myApp.controller('MainCtrl', function($scope, angularCommunicatorService) {
//...
angularCommunicatorService.execQueue(['update', 'save', 'bar:save'], [{update: true}]);
//...
});Pass an argument to each listener with an array of arguments.
myApp.controller('MainCtrl', function($scope, angularCommunicatorService) {
//...
angularCommunicatorService.execQueue(['update', 'save', 'bar:save'], [{update: true}, {update: false}, {name: 'bar.save'}]);
//...
});By default the first argument is passed to the listener whether it doesn't have an correspondent argument.
myApp.controller('MainCtrl', function($scope, angularCommunicatorService) {
angularCommunicatorService.on('update', function(obj) {
//obj -> {update: true}
});
angularCommunicatorService.on('save', function(obj) {
//obj -> {save: false}
});
angularCommunicatorService.on('bar:save', function(obj) {
//obj -> {update: true}
});
//...
angularCommunicatorService.execQueue(['update', 'save', 'bar:save'], [{update: true}, {save: false}]);
//...
});Remove an listener from communicator.
myApp.controller('MainCtrl', function($scope, angularCommunicatorService) {
//...
angularCommunicatorService.remove('update');
//...
});Remove all listeners from communicator.
myApp.controller('MainCtrl', function($scope, angularCommunicatorService) {
//...
angularCommunicatorService.clearAll();
//...
});