Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(1095)

Side by Side Diff: third_party/pkg/angular/lib/directive/ng_if.dart

Issue 124053002: Adding Angular and dependent packages for testing (Closed) Base URL: https://dart.googlecode.com/svn/branches/bleeding_edge/dart
Patch Set: Created 6 years, 11 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch | Annotate | Revision Log
OLDNEW
(Empty)
1 part of angular.directive;
2
3 /**
4 * Base class for NgIfAttrDirective and NgUnlessAttrDirective.
5 */
6 abstract class _NgUnlessIfAttrDirectiveBase {
7 final BoundBlockFactory _boundBlockFactory;
8 final BlockHole _blockHole;
9 final Scope _scope;
10
11 Block _block;
12
13 /**
14 * The new child scope. This child scope is recreated whenever the `ng-if`
15 * subtree is inserted into the DOM and destroyed when it's removed from the
16 * DOM. Refer
17 * https://github.com/angular/angular.js/wiki/The-Nuances-of-Scope-Prototypal- Inheritance prototypal inheritance
18 */
19 Scope _childScope;
20
21 _NgUnlessIfAttrDirectiveBase(this._boundBlockFactory, this._blockHole, this._s cope);
22
23 // Override in subclass.
24 set condition(value);
25
26 void _ensureBlockExists() {
27 if (_block == null) {
28 _childScope = _scope.$new();
29 _block = _boundBlockFactory(_childScope);
30 _block.insertAfter(_blockHole);
31 }
32 }
33
34 void _ensureBlockDestroyed() {
35 if (_block != null) {
36 _block.remove();
37 _childScope.$destroy();
38 _block = null;
39 _childScope = null;
40 }
41 }
42 }
43
44
45 /**
46 * The `ng-if` directive compliments the `ng-unless` (provided by
47 * [NgUnlessAttrDirective]) directive.
48 *
49 * directive based on the **truthy/falsy** value of the provided expression.
50 * Specifically, if the expression assigned to `ng-if` evaluates to a `false`
51 * value, then the subtree is removed from the DOM. Otherwise, *a clone of the
52 * subtree* is reinserted into the DOM. This clone is created from the compiled
53 * state. As such, modifications made to the element after compilation (e.g.
54 * changing the `class`) are lost when the element is destroyed.
55 *
56 * Whenever the subtree is inserted into the DOM, it always gets a new child
57 * scope. This child scope is destroyed when the subtree is removed from the
58 * DOM. Refer
59 * https://github.com/angular/angular.js/wiki/The-Nuances-of-Scope-Prototypal-In heritance prototypal inheritance
60 *
61 * This has an important implication when `ng-model` is used inside an `ng-if`
62 * to bind to a javascript primitive defined in the parent scope. In such a
63 * situation, any modifications made to the variable in the `ng-if` subtree will
64 * be made on the child scope and override (hide) the value in the parent scope.
65 * The parent scope will remain unchanged by changes affected by this subtree.
66 *
67 * Note: `ng-if` differs from `ng-show` and `ng-hide` in that `ng-if` completely
68 * removes and recreates the element in the DOM rather than changing its
69 * visibility via the `display` css property. A common case when this
70 * difference is significant is when using css selectors that rely on an
71 * element's position within the DOM (HTML), such as the `:first-child` or
72 * `:last-child` pseudo-classes.
73 *
74 * Example:
75 *
76 * <!-- By using ng-if instead of ng-show, we avoid the cost of the showdown
77 * filter, the repeater, etc. -->
78 * <div ng-if="showDetails">
79 * {{obj.details.markdownText | showdown}}
80 * <div ng-repeat="item in obj.details.items">
81 * ...
82 * </div>
83 * </div>
84 */
85 @NgDirective(
86 children: NgAnnotation.TRANSCLUDE_CHILDREN,
87 selector:'[ng-if]',
88 map: const {'.': '=>condition'})
89 class NgIfDirective extends _NgUnlessIfAttrDirectiveBase {
90 NgIfDirective(BoundBlockFactory boundBlockFactory,
91 BlockHole blockHole,
92 Scope scope): super(boundBlockFactory, blockHole, scope);
93
94 set condition(value) {
95 if (toBool(value))
96 _ensureBlockExists();
97 else
98 _ensureBlockDestroyed();
99 }
100 }
101
102
103 /**
104 * The `ng-unless` directive compliments the `ng-if` (provided by
105 * [NgIfAttrDirective]) directive.
106 *
107 * The `ng-unless` directive recreates/destroys the DOM subtree containing the
108 * directive based on the **falsy/truthy** value of the provided expression.
109 * Specifically, if the expression assigned to `ng-unless` evaluates to a `true`
110 * value, then the subtree is removed from the DOM. Otherwise, *a clone of the
111 * subtree* is reinserted into the DOM. This clone is created from the compiled
112 * state. As such, modifications made to the element after compilation (e.g.
113 * changing the `class`) are lost when the element is destroyed.
114 *
115 * Whenever the subtree is inserted into the DOM, it always gets a new child
116 * scope. This child scope is destroyed when the subtree is removed from the
117 * DOM. Refer
118 * https://github.com/angular/angular.js/wiki/The-Nuances-of-Scope-Prototypal-In heritance prototypal inheritance
119 *
120 * This has an important implication when `ng-model` is used inside an
121 * `ng-unless` to bind to a javascript primitive defined in the parent scope.
122 * In such a situation, any modifications made to the variable in the
123 * `ng-unless` subtree will be made on the child scope and override (hide) the
124 * value in the parent scope. The parent scope will remain unchanged by changes
125 * affected by this subtree.
126 *
127 * Note: `ng-unless` differs from `ng-show` and `ng-hide` in that `ng-unless`
128 * completely removes and recreates the element in the DOM rather than changing
129 * its visibility via the `display` css property. A common case when this
130 * difference is significant is when using css selectors that rely on an
131 * element's position within the DOM (HTML), such as the `:first-child` or
132 * `:last-child` pseudo-classes.
133 *
134 * Example:
135 *
136 * <!-- By using ng-unless instead of ng-show, we avoid the cost of the show down
137 * filter, the repeater, etc. -->
138 * <div ng-unless="terseView">
139 * {{obj.details.markdownText | showdown}}
140 * <div ng-repeat="item in obj.details.items">
141 * ...
142 * </div>
143 * </div>
144 */
145 @NgDirective(
146 children: NgAnnotation.TRANSCLUDE_CHILDREN,
147 selector:'[ng-unless]',
148 map: const {'.': '=>condition'})
149 class NgUnlessDirective extends _NgUnlessIfAttrDirectiveBase {
150
151 NgUnlessDirective(BoundBlockFactory boundBlockFactory,
152 BlockHole blockHole,
153 Scope scope): super(boundBlockFactory, blockHole, scope) ;
154
155 set condition(value) {
156 if (!toBool(value))
157 _ensureBlockExists();
158 else
159 _ensureBlockDestroyed();
160 }
161 }
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698