|
1 | 1 | part of angular.directive;
|
2 | 2 |
|
3 | 3 | /**
|
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 |
6 |
| - * your application is loading. Use this directive to avoid the undesirable |
7 |
| - * flicker effect caused by the html template display. |
| 4 | + * Hides elements on the page while the application loads. `Selector: [ng-cloak], .ng-cloak` |
8 | 5 | *
|
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 |
11 |
| - * rendering of the browser view. |
| 6 | + * This prevents template artifacts from being briefly displayed by the browser in their raw (uncompiled) form while |
| 7 | + * your application is loading. Use this directive to avoid the undesirable flicker effect caused by the HTML template |
| 8 | + * display. |
12 | 9 | *
|
13 |
| - * `ngCloak` works in cooperation with a css. Following is the css rule: |
| 10 | + * The directive can be applied to the `<body>` element, but typically a fine-grained application is preferred in order |
| 11 | + * to benefit from progressive rendering of the browser view. |
| 12 | + * |
| 13 | + * `ng-cloak` works in conjunction with a css rule: |
14 | 14 | *
|
15 | 15 | * [ng-cloak], [data-ng-cloak], .ng-cloak {
|
16 | 16 | * display: none !important;
|
17 | 17 | * }
|
18 | 18 | *
|
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. |
21 |
| - * When Angular comes across this directive during the compilation of the |
22 |
| - * template it deletes the `ngCloak` element attribute, which makes the compiled |
23 |
| - * element visible. |
| 19 | + * When this css rule is loaded by the browser, all elements (including their children) that are tagged with `ng-cloak` |
| 20 | + * are hidden. When Angular encounters this directive during the compilation of the template, it deletes the `ng-cloak` |
| 21 | + * element attribute, making the compiled element visible. |
| 22 | + * |
| 23 | + * # Examples |
| 24 | + * NgCloak can be used as an attribute: |
| 25 | + * |
| 26 | + * <div ng-cloak> |
| 27 | + * |
| 28 | + * Or as a class name: |
| 29 | + * |
| 30 | + * <div class="myclass ng-cloak"> |
| 31 | + * |
24 | 32 | */
|
25 | 33 | @Decorator(selector: '[ng-cloak]')
|
26 | 34 | @Decorator(selector: '.ng-cloak')
|
|
0 commit comments