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

Commit

Permalink
fixup
Browse files Browse the repository at this point in the history
  • Loading branch information
Narretz committed Nov 22, 2016
1 parent 275b4e3 commit f97ed1f
Showing 1 changed file with 5 additions and 9 deletions.
14 changes: 5 additions & 9 deletions docs/content/guide/compiler.ngdoc
Original file line number Diff line number Diff line change
Expand Up @@ -386,7 +386,7 @@ Double compilation occurs when an already compiled part of the DOM gets compiled
undesired effect and can lead to misbehaving directives, performance issues, and memory
leaks.
A common scenario where this happens is a directive that calls `$compile` in a directive link
function on the directive element. In the following example, a directive adds a mouseover behavior
function on the directive element. In the following **faulty example**, a directive adds a mouseover behavior
to a button with `ngClick` on it:

```
Expand Down Expand Up @@ -427,7 +427,6 @@ angular.module('app').directive('addMouseover', function($compile) {
scope.$apply('showHint = !showHint');
});

attrs.$set('addMouseover', null);
element.append(newEl);
$compile(newEl)(scope); // Only compile the new element
}
Expand All @@ -436,7 +435,7 @@ angular.module('app').directive('addMouseover', function($compile) {
```

Another scenario is adding a directive programmatically to a compiled element and then executing
compile again.
compile again. See the following **faulty example**:

```html
<input ng-model="$ctrl.value" add-options>
Expand All @@ -459,19 +458,16 @@ In that case, it is necessary to intercept the *initial* compilation of the elem
1. Give your directive the `terminal` property and a higher priority than directives
that should not be compiled twice. In the example, the compiler will only compile directives
which have a priority of 100 or higher.
2. Inside this directive's compile function, remove the original directive attribute from the element,
and add any other directive attributes. Removing the attribute is necessary, because otherwise the
compilation would result in an infinite loop.
3. Compile the element but restrict the maximum priority, so that any already compiled directives
are not compiled twice.
2. Inside this directive's compile function, add any other directive attributes to the template.
3. Compile the element, but restrict the maximum priority, so that any already compiled directives
(including the `addOptions` directive) are not compiled again.
4. In the link function, link the compiled element with the element's scope

```
angular.module('app').directive('addOptions', function($compile) {
return {
priority: 100, // ngModel has priority 1
terminal: true,
template: '<input ng-model="$ctrl.value">',
compile: function(templateElement, templateAttributes) {
templateAttributes.$set('ngModelOptions', '{debounce: 1000}');

Expand Down

0 comments on commit f97ed1f

Please sign in to comment.