Почему компиляция выполняется несколько раз - Угловая директива

В следующем фрагменте я хочу спросить, что если фаза компиляции выполняется только один раз для всех экземпляров директивы, то почему я вижу, что console.log («compile») запускает 5 раз? Он должен был работать только один раз? Не так ли?Почему компиляция выполняется несколько раз - Угловая директива

//module declaration 
 
var app = angular.module('myApp',[]); 
 

 
//controller declaration 
 
app.controller('myCtrl',function($scope){ 
 
\t $scope.name = "Joseph"; 
 
}); 
 

 
//app declaration 
 
app.directive('myStudent',function(){ 
 
\t return{ 
 
\t \t template: "Hi! Dear!! {{name}}<br/>", 
 
\t \t compile: function(elem, attr){ 
 
\t \t \t console.log("compile"); 
 
\t \t } 
 
\t } 
 
});

<body ng-app="myApp" ng-controller="myCtrl"> 
 
<my-student></my-student> 
 
<my-student></my-student> 
 
<my-student></my-student> 
 
<my-student></my-student> 
 
<my-student></my-student> 
 

 
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.5/angular.min.js"></script> 
 
</body>

источник

2016-12-13 Deadpool

его для каждого экземпляра его. 'compile! = $ compile' –

Не могли бы вы это немного объяснить? – Deadpool

HTML компиляция происходит в три этапа:

$ компиляции пересекает DOM и соответствует директивам.

Если компилятор обнаруживает, что элемент соответствует директиве, тогда директива добавляется в список директив, соответствующих элементу DOM. Один элемент может соответствовать нескольким директивам.
Как только все директивы, соответствующие элементу DOM, были идентифицированы, компилятор сортирует директивы по их приоритету.

Выполняются функции компиляции каждой директивы. Каждая функция компиляции имеет возможность изменить DOM. Каждая функция компиляции возвращает функцию связи. Эти функции состоят из «комбинированной» функции ссылок, которая вызывает функцию возврата ссылки каждой директивы.
$ compile связывает шаблон с областью действия, вызывая комбинированную функцию привязки с предыдущего шага. Это, в свою очередь, вызовет функцию связывания отдельных директив, зарегистрирует слушателей на элементах и настроит $ watchs с областью, как это настраивается каждой директивой.

источник

2016-12-13 13:37:54 Raj

Он все еще не отвечает, почему мой компилятор работает 5 раз? – Deadpool

Фаза компиляции При загрузке DOM Угловой начинает фазу компиляции, где она пересекает разметку сверху вниз и вызывает компиляцию по всем директивам. Графически, мы могли бы выразить это так: https://i.stack.imgur.com/PZPOm.png Для вложенных директив Примечание: В приведенной ниже не относится к директивам, которые отдают своих детей в их связи функция. Довольно много угловых директив делают это (например, ngIf, ngRepeat или любая директива с трансключением). Эти директивы будут изначально иметь свою функцию связи, вызванную до вызова их дочерних директив. – Raj

С угловыми документации «Какие директивы? На высоком уровне директивы являются маркерами на DOM элемента (например, атрибут, имя элемента, комментарий или класс CSS), которые говорят HTML компилятор AngularJS (в $ компилировать), чтобы связать указанное поведение с этим элементом DOM (например, через прослушиватели событий) или даже преобразовать элемент DOM и его дочерние элементы ».

Поэтому, когда угловой компилирует html, он проходит через отметку и всякий раз, когда находит <my-student></my-student>, отметьте его, попробуйте добавить «конкретное поведение». Чтобы получить конкретное поведение, ему нужно каждый раз составлять директиву, поскольку каждый экземпляр директив может иметь разные атрибуты или параметры.

источник

2016-12-13 14:22:13

Почему компиляция выполняется несколько раз - Угловая директива

ответ

Смежные вопросы