Порядок выполнения директивных функций в AngularJS
Каков порядок выполнения директивных функций? документация, похоже, не затрагивает этого.
Пример
- template/templateUrl (оценивается)
- controllerFn
- compileFn
- linkFn
Ответ
От answer ниже: http://plnkr.co/edit/79iyKSbfxgkzk2Pivuak (plunker показывает вложенные и родственные директивы)
- Шаблон проанализирован
-
compile()
(изменения, внесенные в шаблон внутри компиляции, распространяются вплоть до связывания функций)
-
controller()
-
preLink()
-
postLink()
Ответы
Ответ 1
Функция предварительной привязки: выполняется до того, как дочерние элементы связаны. Небезопасно выполнять преобразование DOM, поскольку функция связывания компилятора не смогут найти правильные элементы для компоновки.
Функция постсвязывания: Выполняется после того, как дочерние элементы связаны. Это безопасно выполнять преобразование DOM в функции постсвязывания.
Выше выдержка взята из официальных документов в .
Итак, чтобы ответить на ваш вопрос, функция Post-linking/Link - это когда/где вы можете безопасно работать с element.children().
Ответ 2
на соответствующей заметке, здесь мое понимание порядка exec в DOM.
Вот демонстрационная версия (открытая консоль JS для браузера)
Учитывая эту DOM с помощью директивы foo
:
<div id="1" foo>
one
<div id="1_1" foo>one.one</div>
</div>
<div id="2" foo>two</div>
... AngularJS будет пересекать DOM - дважды - в глубине-первом порядке:
1-й проход foo.compile()
1) скомпилировать: 1
2) скомпилировать: 1_1
3) скомпилировать: 2
2-й проход: foo.controller() пересекает вниз; foo.link(), в то время как backtracking
: 1
: 1_1
ссылка: 1_1
ссылка: 1
: 2
ссылка: 2