AngularJS директивы. Жизненный цикл

Всем приветы!

Публикуем мануал по AngularJS, который будет очень полезен разработчику, который уже знаком с основами AngularJS фреймворка и уже знает, как создавать свои директивы, знает, что такое объект определения директивы и его свойства, которые подробно описаны в официальной документации.

В этом мануале мы детально рассмотрим жизненный цикл директив, разберём подробнее функции объекта определения директивы (link, compile, controller), определим порядок их выполнения и приведем особенности их использования.

Поехали!

При написании директивы для управления ее поведением можно использовать любое из следующих свойств объекта определения директивы: compile, link, controller. В них мы можем манипулировать разметкой, работать с дочерними элементами, реализовывать бизнес логику, присоединить обработчики событий и назначить наблюдателей (observers и watches) к атрибутам.

Compile - это функция, которая преобразует шаблон DOM в angular приложение. Не все директивы выполняют преобразование шаблона, поэтому она часто не используется.

Link - это функция, которая отвечает за регистрацию DOM-обработчиков событий и за обновление DOM. Чаще всего здесь находится большая часть логики директивы.

Controller - это функция конструктора контроллера директивы.

Функции Compile и Link будут возвращать либо объект с функциями preLink и postLink, либо просто возвращать функцию, которая будет являться postLink.

preLink - выполняется до того, как дочерние элементы директивы обработаны и связаны.

postLink - выполняется после того, как дочерние элементы директивы обработаны и связаны.

Какое свойство и для каких целей лучше подходит, мы разберем чуть дальше, а пока подробно рассмотрим порядок их выполнения и жизненный цикл директивы.

Читайте продолжение технической статьи по ссылке.

Место солидарности беларусского ИТ-комьюнити

Далучайся!