OLD | NEW |
1 part of angular.directive; | 1 part of angular.directive; |
2 | 2 |
3 /** | 3 /** |
4 * The `ngCloak` directive is used to prevent the Angular html template from | 4 * The `ngCloak` directive is used to prevent the Angular html template from |
5 * being briefly displayed by the browser in its raw (uncompiled) form while | 5 * being briefly displayed by the browser in its raw (uncompiled) form while |
6 * your application is loading. Use this directive to avoid the undesirable | 6 * your application is loading. Use this directive to avoid the undesirable |
7 * flicker effect caused by the html template display. | 7 * flicker effect caused by the html template display. |
8 * | 8 * |
9 * The directive can be applied to the `<body>` element, but typically a | 9 * The directive can be applied to the `<body>` element, but typically a |
10 * fine-grained application is preferred in order to benefit from progressive | 10 * fine-grained application is preferred in order to benefit from progressive |
11 * rendering of the browser view. | 11 * rendering of the browser view. |
12 * | 12 * |
13 * `ngCloak` works in cooperation with a css. Following is the css rule: | 13 * `ngCloak` works in cooperation with a css. Following is the css rule: |
14 * | 14 * |
15 * [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak { | 15 * [ng-cloak], [data-ng-cloak], .ng-cloak { |
16 * display: none !important; | 16 * display: none !important; |
17 * } | 17 * } |
18 * | 18 * |
19 * When this css rule is loaded by the browser, all html elements (including | 19 * When this css rule is loaded by the browser, all html elements (including |
20 * their children) that are tagged with the `ng-cloak` directive are hidden. | 20 * their children) that are tagged with the `ng-cloak` directive are hidden. |
21 * When Angular comes across this directive during the compilation of the | 21 * When Angular comes across this directive during the compilation of the |
22 * template it deletes the `ngCloak` element attribute, which makes the compiled | 22 * template it deletes the `ngCloak` element attribute, which makes the compiled |
23 * element visible. | 23 * element visible. |
24 */ | 24 */ |
25 @NgDirective(selector: '[ng-cloak]') | 25 @Decorator(selector: '[ng-cloak]') |
26 @NgDirective(selector: '.ng-cloak') | 26 @Decorator(selector: '.ng-cloak') |
27 class NgCloakDirective { | 27 class NgCloak { |
28 NgCloakDirective(dom.Element element) { | 28 NgCloak(dom.Element element, Animate animate) { |
29 element.attributes.remove('ng-cloak'); | 29 element.attributes.remove('ng-cloak'); |
30 element.classes.remove('ng-cloak'); | 30 animate.removeClass(element, 'ng-cloak'); |
31 } | 31 } |
32 } | 32 } |
OLD | NEW |