Skip to content
This repository was archived by the owner on Apr 12, 2024. It is now read-only.

Commit e5eeb2e

Browse files
jdavisp3btford
authored andcommitted
docs(ngIf): formatting, clarity
1 parent 45028e5 commit e5eeb2e

File tree

1 file changed

+12
-12
lines changed

1 file changed

+12
-12
lines changed

src/ng/directive/ngIf.js

+12-12
Original file line numberDiff line numberDiff line change
@@ -6,32 +6,31 @@
66
* @restrict A
77
*
88
* @description
9-
* The `ngIf` directive removes and recreates a portion of the DOM tree (HTML)
10-
* conditionally based on **"falsy"** and **"truthy"** values, respectively, evaluated within
11-
* an {expression}. In other words, if the expression assigned to **ngIf evaluates to a false
12-
* value** then **the element is removed from the DOM** and **if true** then **a clone of the
13-
* element is reinserted into the DOM**.
9+
* The `ngIf` directive removes or recreates a portion of the DOM tree based on an
10+
* {expression}. If the expression assigned to `ngIf` evaluates to a false
11+
* value then the element is removed from the DOM, otherwise a clone of the
12+
* element is reinserted into the DOM.
1413
*
1514
* `ngIf` differs from `ngShow` and `ngHide` in that `ngIf` completely removes and recreates the
1615
* element in the DOM rather than changing its visibility via the `display` css property. A common
1716
* case when this difference is significant is when using css selectors that rely on an element's
18-
* position within the DOM (HTML), such as the `:first-child` or `:last-child` pseudo-classes.
17+
* position within the DOM, such as the `:first-child` or `:last-child` pseudo-classes.
1918
*
20-
* Note that **when an element is removed using ngIf its scope is destroyed** and **a new scope
21-
* is created when the element is restored**. The scope created within `ngIf` inherits from
19+
* Note that when an element is removed using `ngIf` its scope is destroyed and a new scope
20+
* is created when the element is restored. The scope created within `ngIf` inherits from
2221
* its parent scope using
2322
* {@link https://github.com/angular/angular.js/wiki/The-Nuances-of-Scope-Prototypal-Inheritance prototypal inheritance}.
2423
* An important implication of this is if `ngModel` is used within `ngIf` to bind to
2524
* a javascript primitive defined in the parent scope. In this case any modifications made to the
2625
* variable within the child scope will override (hide) the value in the parent scope.
2726
*
28-
* Also, `ngIf` recreates elements using their compiled state. An example scenario of this behavior
27+
* Also, `ngIf` recreates elements using their compiled state. An example of this behavior
2928
* is if an element's class attribute is directly modified after it's compiled, using something like
3029
* jQuery's `.addClass()` method, and the element is later removed. When `ngIf` recreates the element
3130
* the added class will be lost because the original compiled state is used to regenerate the element.
3231
*
33-
* Additionally, you can provide animations via the ngAnimate module to animate the **enter**
34-
* and **leave** effects.
32+
* Additionally, you can provide animations via the `ngAnimate` module to animate the `enter`
33+
* and `leave` effects.
3534
*
3635
* @animations
3736
* enter - happens just after the ngIf contents change and a new DOM element is created and injected into the ngIf container
@@ -40,7 +39,8 @@
4039
* @element ANY
4140
* @scope
4241
* @param {expression} ngIf If the {@link guide/expression expression} is falsy then
43-
* the element is removed from the DOM tree (HTML).
42+
* the element is removed from the DOM tree. If it is truthy a copy of the compiled
43+
* eleent is added to the DOM tree.
4444
*
4545
* @example
4646
<example animations="true">

0 commit comments

Comments
 (0)