AngularJS Decorator
How to use the Angular decorator to intercept a service
by Mohamed Rias
HTML
<script src="http://code.angularjs.org/1.2.0/angular.min.js"></script>
<div data-ng-app="myApp">
<div data-ng-controller='MyController'>{{title}}</div>
<hr/>
<div data-ng-repeat="line in console"> <pre>{{line}}</pre>
</div>
</div>
JavaScript
(function () {
var MyConsole = (function () {
function MyConsole($injector) {
this.lines = [];
this.rootScope = false;
this.writeLn = this.lazyRootCheckFn;
this.injector = $injector;
}
MyConsole.prototype.pushFn = function (message) {
this.lines.push(message);
};
MyConsole.prototype.lazyRootCheckFn = function (message) {
this.pushFn(message);
if (!this.rootScope && this.injector.has('$rootScope')) {
this.rootScope = true;
this.injector.get('$rootScope').console = this.lines;
this.writeLn = this.pushFn;
}
};
MyConsole.$inject = ['$injector'];
return MyConsole;
})();
var MyController = (function () {
function MyController($scope, $log) {
this.$scope = $scope;
this.$log = $log;
$scope.title = 'Decorator example';
$log.warn('This is a warning.');
$log.error('This is an error.');
}
MyController.$injector = ['$scope', '$log'];
return MyController;
})();
var app = angular.module('myApp', []);
app.service('myConsole', MyConsole);
app.controller('MyController', MyController);
app.config([
'$provide', function ($provide) {
$provide.decorator('$log', [
'$delegate',
'myConsole',
function ($delegate, myConsole) {
var swap = function (originalFn) {
return function () {
var args = [].slice.call(arguments);
angular.forEach(args, function (value, index) {
myConsole.writeLn(value);
});
originalFn.apply(null, args);
};
};
$delegate.warn =...