| OLD | NEW |
| 1 part of angular.directive; | 1 part of angular.directive; |
| 2 | 2 |
| 3 /** | 3 /** |
| 4 * Base class for NgIfAttrDirective and NgUnlessAttrDirective. | 4 * Base class for NgIfAttrDirective and NgUnlessAttrDirective. |
| 5 */ | 5 */ |
| 6 abstract class _NgUnlessIfAttrDirectiveBase { | 6 abstract class _NgUnlessIfAttrDirectiveBase { |
| 7 final BoundBlockFactory _boundBlockFactory; | 7 final BoundBlockFactory _boundBlockFactory; |
| 8 final BlockHole _blockHole; | 8 final BlockHole _blockHole; |
| 9 final Scope _scope; | 9 final Scope _scope; |
| 10 | 10 |
| 11 Block _block; | 11 Block _block; |
| 12 | 12 |
| 13 /** | 13 /** |
| 14 * The new child scope. This child scope is recreated whenever the `ng-if` | 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 | 15 * subtree is inserted into the DOM and destroyed when it's removed from the |
| 16 * DOM. Refer | 16 * DOM. Refer |
| 17 * https://github.com/angular/angular.js/wiki/The-Nuances-of-Scope-Prototypal-
Inheritance prototypal inheritance | 17 * https://github.com/angular/angular.js/wiki/The-Nuances-of-Scope-prototypica
l-Inheritance prototypical inheritance |
| 18 */ | 18 */ |
| 19 Scope _childScope; | 19 Scope _childScope; |
| 20 | 20 |
| 21 _NgUnlessIfAttrDirectiveBase(this._boundBlockFactory, this._blockHole, this._s
cope); | 21 _NgUnlessIfAttrDirectiveBase(this._boundBlockFactory, this._blockHole, |
| 22 this._scope); |
| 22 | 23 |
| 23 // Override in subclass. | 24 // Override in subclass. |
| 24 set condition(value); | 25 set condition(value); |
| 25 | 26 |
| 26 void _ensureBlockExists() { | 27 void _ensureBlockExists() { |
| 27 if (_block == null) { | 28 if (_block == null) { |
| 28 _childScope = _scope.$new(); | 29 _childScope = _scope.createChild(new PrototypeMap(_scope.context)); |
| 29 _block = _boundBlockFactory(_childScope); | 30 _block = _boundBlockFactory(_childScope); |
| 30 _block.insertAfter(_blockHole); | 31 var insertBlock = _block; |
| 32 _scope.rootScope.domWrite(() { |
| 33 insertBlock.insertAfter(_blockHole); |
| 34 }); |
| 31 } | 35 } |
| 32 } | 36 } |
| 33 | 37 |
| 34 void _ensureBlockDestroyed() { | 38 void _ensureBlockDestroyed() { |
| 35 if (_block != null) { | 39 if (_block != null) { |
| 36 _block.remove(); | 40 var removeBlock = _block; |
| 37 _childScope.$destroy(); | 41 _scope.rootScope.domWrite(() { |
| 42 removeBlock.remove(); |
| 43 }); |
| 44 _childScope.destroy(); |
| 38 _block = null; | 45 _block = null; |
| 39 _childScope = null; | 46 _childScope = null; |
| 40 } | 47 } |
| 41 } | 48 } |
| 42 } | 49 } |
| 43 | 50 |
| 44 | 51 |
| 45 /** | 52 /** |
| 46 * The `ng-if` directive compliments the `ng-unless` (provided by | 53 * The `ng-if` directive compliments the `ng-unless` (provided by |
| 47 * [NgUnlessAttrDirective]) directive. | 54 * [NgUnlessAttrDirective]) directive. |
| 48 * | 55 * |
| 49 * directive based on the **truthy/falsy** value of the provided expression. | 56 * directive based on the **truthy/falsy** value of the provided expression. |
| 50 * Specifically, if the expression assigned to `ng-if` evaluates to a `false` | 57 * 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 | 58 * 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 | 59 * 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. | 60 * state. As such, modifications made to the element after compilation (e.g. |
| 54 * changing the `class`) are lost when the element is destroyed. | 61 * changing the `class`) are lost when the element is destroyed. |
| 55 * | 62 * |
| 56 * Whenever the subtree is inserted into the DOM, it always gets a new child | 63 * 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 | 64 * scope. This child scope is destroyed when the subtree is removed from the |
| 58 * DOM. Refer | 65 * DOM. Refer |
| 59 * https://github.com/angular/angular.js/wiki/The-Nuances-of-Scope-Prototypal-In
heritance prototypal inheritance | 66 * https://github.com/angular/angular.js/wiki/The-Nuances-of-Scope-prototypical-
Inheritance prototypical inheritance |
| 60 * | 67 * |
| 61 * This has an important implication when `ng-model` is used inside an `ng-if` | 68 * 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 | 69 * 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 | 70 * 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. | 71 * 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. | 72 * The parent scope will remain unchanged by changes affected by this subtree. |
| 66 * | 73 * |
| 67 * Note: `ng-if` differs from `ng-show` and `ng-hide` in that `ng-if` completely | 74 * 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 | 75 * removes and recreates the element in the DOM rather than changing its |
| 69 * visibility via the `display` css property. A common case when this | 76 * visibility via the `display` css property. A common case when this |
| (...skipping 11 matching lines...) Expand all Loading... |
| 81 * ... | 88 * ... |
| 82 * </div> | 89 * </div> |
| 83 * </div> | 90 * </div> |
| 84 */ | 91 */ |
| 85 @NgDirective( | 92 @NgDirective( |
| 86 children: NgAnnotation.TRANSCLUDE_CHILDREN, | 93 children: NgAnnotation.TRANSCLUDE_CHILDREN, |
| 87 selector:'[ng-if]', | 94 selector:'[ng-if]', |
| 88 map: const {'.': '=>condition'}) | 95 map: const {'.': '=>condition'}) |
| 89 class NgIfDirective extends _NgUnlessIfAttrDirectiveBase { | 96 class NgIfDirective extends _NgUnlessIfAttrDirectiveBase { |
| 90 NgIfDirective(BoundBlockFactory boundBlockFactory, | 97 NgIfDirective(BoundBlockFactory boundBlockFactory, |
| 91 BlockHole blockHole, | 98 BlockHole blockHole, |
| 92 Scope scope): super(boundBlockFactory, blockHole, scope); | 99 Scope scope): super(boundBlockFactory, blockHole, scope); |
| 93 | 100 |
| 94 set condition(value) { | 101 set condition(value) { |
| 95 if (toBool(value)) | 102 if (toBool(value)) { |
| 96 _ensureBlockExists(); | 103 _ensureBlockExists(); |
| 97 else | 104 } else { |
| 98 _ensureBlockDestroyed(); | 105 _ensureBlockDestroyed(); |
| 106 } |
| 99 } | 107 } |
| 100 } | 108 } |
| 101 | 109 |
| 102 | 110 |
| 103 /** | 111 /** |
| 104 * The `ng-unless` directive compliments the `ng-if` (provided by | 112 * The `ng-unless` directive compliments the `ng-if` (provided by |
| 105 * [NgIfAttrDirective]) directive. | 113 * [NgIfAttrDirective]) directive. |
| 106 * | 114 * |
| 107 * The `ng-unless` directive recreates/destroys the DOM subtree containing the | 115 * The `ng-unless` directive recreates/destroys the DOM subtree containing the |
| 108 * directive based on the **falsy/truthy** value of the provided expression. | 116 * directive based on the **falsy/truthy** value of the provided expression. |
| 109 * Specifically, if the expression assigned to `ng-unless` evaluates to a `true` | 117 * 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 | 118 * 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 | 119 * 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. | 120 * state. As such, modifications made to the element after compilation (e.g. |
| 113 * changing the `class`) are lost when the element is destroyed. | 121 * changing the `class`) are lost when the element is destroyed. |
| 114 * | 122 * |
| 115 * Whenever the subtree is inserted into the DOM, it always gets a new child | 123 * 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 | 124 * scope. This child scope is destroyed when the subtree is removed from the |
| 117 * DOM. Refer | 125 * DOM. Refer |
| 118 * https://github.com/angular/angular.js/wiki/The-Nuances-of-Scope-Prototypal-In
heritance prototypal inheritance | 126 * https://github.com/angular/angular.js/wiki/The-Nuances-of-Scope-prototypical-
Inheritance prototypical inheritance |
| 119 * | 127 * |
| 120 * This has an important implication when `ng-model` is used inside an | 128 * 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. | 129 * `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 | 130 * 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 | 131 * `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 | 132 * value in the parent scope. The parent scope will remain unchanged by changes |
| 125 * affected by this subtree. | 133 * affected by this subtree. |
| 126 * | 134 * |
| 127 * Note: `ng-unless` differs from `ng-show` and `ng-hide` in that `ng-unless` | 135 * 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 | 136 * completely removes and recreates the element in the DOM rather than changing |
| (...skipping 13 matching lines...) Expand all Loading... |
| 142 * </div> | 150 * </div> |
| 143 * </div> | 151 * </div> |
| 144 */ | 152 */ |
| 145 @NgDirective( | 153 @NgDirective( |
| 146 children: NgAnnotation.TRANSCLUDE_CHILDREN, | 154 children: NgAnnotation.TRANSCLUDE_CHILDREN, |
| 147 selector:'[ng-unless]', | 155 selector:'[ng-unless]', |
| 148 map: const {'.': '=>condition'}) | 156 map: const {'.': '=>condition'}) |
| 149 class NgUnlessDirective extends _NgUnlessIfAttrDirectiveBase { | 157 class NgUnlessDirective extends _NgUnlessIfAttrDirectiveBase { |
| 150 | 158 |
| 151 NgUnlessDirective(BoundBlockFactory boundBlockFactory, | 159 NgUnlessDirective(BoundBlockFactory boundBlockFactory, |
| 152 BlockHole blockHole, | 160 BlockHole blockHole, |
| 153 Scope scope): super(boundBlockFactory, blockHole, scope)
; | 161 Scope scope): super(boundBlockFactory, blockHole, scope); |
| 154 | 162 |
| 155 set condition(value) { | 163 set condition(value) { |
| 156 if (!toBool(value)) | 164 if (!toBool(value)) { |
| 157 _ensureBlockExists(); | 165 _ensureBlockExists(); |
| 158 else | 166 } else { |
| 159 _ensureBlockDestroyed(); | 167 _ensureBlockDestroyed(); |
| 168 } |
| 160 } | 169 } |
| 161 } | 170 } |
| OLD | NEW |