$PROVIDE.DECORATOR()

MODIFYING THE BEHAVIOROF ANGULARJS' CORE SERVICES

DAMIEN KLINNERTSoftware Engineer at Small-Improvements

damienklinnert.comtwitter.com/damienklinnertgithub.com/damienklinnert

THE DECORATOR PATTERN

THE COMPLEX WAYangular.module(moduleName, []) .config(function ($provide) { $provide.decorator(serviceName, function ($delegate) {

// modify behavior here

return $delegate; }); });

THE SIMPLE WAYangular.module(moduleName, []) .decorate(serviceName, function ($delegate) {

// modify behavior here

return $delegate; });

www.github.com/damienklinnert/angular-decorate

ONEAPPEND FILE EXTENSION IN

$TEMPLATECACHE.GET()

What you have is:<div ng-include="'views/custom-template.html'"></div>

What you want is:<div ng-include="'views/custom-template'"></div>

// Decorator definitionangular.module('$templateCache+get', ['ng']) .decorate('$templateCache', function ($delegate) { var _get = $delegate.get; $delegate.get = function (key) { return _get.call(_get, key + ".html"); }; return $delegate; });

// Use decorator in whole appangular.module('app', ['$templateCache+get', ...])

TWOADD BASEURL TO EACH

$RESOURCE

Make this possible:var users = $resource('http://localhost/users');console.log(users.baseUrl); // this is new

// Decorator definitionangular.module("$resource+baseUrl", ['ngResource']) .decorate('$resource', function ($delegate) { return function (baseUrl) { var ret = $delegate.apply(this, arguments);

ret.baseUrl = baseUrl;

return ret; }; });

// Use decorator in whole appangular.module('app', ['$resource+baseUrl', ...])

THREEINSTRUMENT ANGULAR

PERFORMANCE

What can you do with this?angular.module('$rootScope+instrument', []).decorate('$rootScope', function ($delegate) {

$delegate.__proto__.$watch = function () { ... }; $delegate.__proto__.$apply = function () { ... };

return $delegate;});

THANK YOURELATED MATERIAL

angular-decorate www.github.com/damienklinnert/angular-decorateHacking Core Directives in AngularJS http://briantford.com/blog/angular-hacking-core.htmlAngular $provide http://docs.angularjs.org/api/auto/object/$provide