Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
angular decorate
Search
damienklinnert
April 09, 2014
Programming
1
73
angular decorate
Use AngularJS' decorate function with ease
damienklinnert
April 09, 2014
Tweet
Share
More Decks by damienklinnert
See All by damienklinnert
Angular Performance Tuning
damienklinnert
4
250
Angular Performance Talk
damienklinnert
0
100
Fight the Rot - Refactor stinky JavaScript
damienklinnert
0
150
modern web apps
damienklinnert
0
100
Become a node package maintainer
damienklinnert
1
80
bootstrap single page apps
damienklinnert
1
300
test your nodejs code
damienklinnert
5
340
Other Decks in Programming
See All in Programming
見た目から始める生産性向上
ikumatadokoro
8
990
Random\Randomizer クラスで日常のあれこれを解決しよう! / Random\Randomizer class solves familiar trouble
cocoeyes02
0
250
SIMD Parallel Programming with the Vector API
josepaumard
0
200
二郎系ラーメンのコールで学ぶ AST 解析
memory1994
PRO
7
1.7k
Netty Chicago Java User Group 2024-04-17
sullis
0
180
Azure OpenAI Serviceのプロンプトエンジニアリング入門
tomokusaba
3
800
Elm Form Validation
bkuhlmann
0
510
単体テストを書かない技術 #phpcon_odawara
o0h
PRO
27
8.3k
PHP8.3の機能を振り返る / Review of PHP 8.3 features
seike460
PRO
1
110
GitHub Copilotのススメ
marcy731
1
200
Polars入門
daikikatsuragawa
1
100
Blue/Greenデプロイの導入による 運用フローの改善
kudoas
1
390
Featured
See All Featured
Music & Morning Musume
bryan
41
5.6k
The Brand Is Dead. Long Live the Brand.
mthomps
49
29k
Scaling GitHub
holman
457
140k
Happy Clients
brianwarren
92
6.4k
Clear Off the Table
cherdarchuk
84
310k
Principles of Awesome APIs and How to Build Them.
keavy
121
16k
What the flash - Photography Introduction
edds
64
11k
YesSQL, Process and Tooling at Scale
rocio
164
13k
Building Effective Engineering Teams - LeadDev
addyosmani
28
1.9k
Designing for Performance
lara
601
67k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
40
4.4k
Gamification - CAS2011
davidbonilla
76
4.6k
Transcript
$PROVIDE .DECORATOR() MODIFYING THE BEHAVIOR OF ANGULARJS' CORE SERVICES
DAMIEN KLINNERT Software Engineer at Small-Improvements damienklinnert.com twitter.com/damienklinnert github.com/damienklinnert
THE DECORATOR PATTERN
None
THE COMPLEX WAY angular.module(moduleName, []) .config(function ($provide) { $provide.decorator(serviceName, function
($delegate) { // modify behavior here return $delegate; }); });
THE SIMPLE WAY angular.module(moduleName, []) .decorate(serviceName, function ($delegate) { //
modify behavior here return $delegate; }); www.github.com/damienklinnert/angular-decorate
ONE APPEND 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 definition angular.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 app angular.module('app', ['$templateCache+get', ...])
TWO ADD BASEURL TO EACH $RESOURCE
Make this possible: var users = $resource('http://localhost/users'); console.log(users.baseUrl); // this
is new
// Decorator definition angular.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 app angular.module('app', ['$resource+baseUrl', ...])
THREE INSTRUMENT 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 YOU RELATED MATERIAL angular-decorate www.github.com/damienklinnert/angular-decorate Hacking Core Directives in
AngularJS http://briantford.com/blog/angular-hacking-core.html Angular $provide http://docs.angularjs.org/api/auto/object/$provide