Diferencia entre las funciones 'controlador', 'enlace' y 'compilar' al definir una directiva

Voy a ampliar un poco tu pregunta y también incluiré la función de compilación.

• función de compilación - use para template DOM manipulation (es decir, manipulación de tElement = template elemento), por lo tanto, manipulaciones que se aplican a todos los clones DOM de la plantilla asociada con la directiva. (Si también necesita una función de enlace (o funciones de enlace anteriores y posteriores), y definió una función de compilación, la función de compilación debe devolver la (s) función (es) de enlace porque el atributo 'link' se ignora si se define el atributo 'compile'.)

• función de enlace: normalmente se utiliza para registrar devoluciones de llamada de oyentes (es decir, $watch expresiones en el alcance), así como para actualizar el DOM (es decir, la manipulación de iElement = elemento de instancia individual). Se ejecuta después de que la plantilla ha sido clonada. Por ejemplo, dentro de un <li ng-repeat...>, la función de enlace se ejecuta después de que la plantilla <li> (tElement) se haya clonado (en un iElement) para ese elemento <li> en particular. Un $watch permite que una directiva sea notificada de los cambios en las propiedades del alcance (un alcance está asociado con cada instancia), lo que permite que la directiva presente un valor de instancia actualizado al DOM.

• función del controlador - debe usarse cuando otra directiva necesita interactuar con esta directiva. Por ejemplo, en la página de inicio de AngularJS, la directiva de panel debe agregarse al ámbito mantenido por la directiva de pestañas, por lo que la directiva de pestañas debe definir un método de controlador (piense en la API) al que la directiva de panel puede acceder/llamar.
  
  Para obtener una explicación más detallada de las directivas de pestañas y paneles, y por qué la directiva de pestañas crea una función en su controlador usando this (en lugar de $scope), consulte 'this' vs $ scope in Controladores AngularJS .

En general, puede poner los métodos, $watches, etc. en el controlador de la directiva o en la función de enlace. El controlador se ejecutará primero, lo que a veces es importante (consulte este violín que se registra cuando las funciones de control y enlace se ejecutan con dos directivas anidadas). Como Josh mencionó en un comentario , es posible que desee colocar funciones de manipulación de alcance dentro de un controlador solo para mantener la coherencia con el resto del marco.

Como complemento de la respuesta de Mark, la función de compilación no tiene acceso al alcance, pero sí la función de enlace.

Realmente recomiendo este video; Directivas de escritura por Misko Hevery (el padre de AngularJS), donde describe las diferencias y algunas técnicas. (Diferencia entre la función de compilación y la función de enlace en la marca 14:41 en el video ).

1. ejecución del código antes de la compilación: use controller
2. ejecución del código después de la compilación: use Enlace

Convención angular: escriba la lógica de negocios en el controlador y la manipulación de DOM en el enlace.

Aparte de esto, puede llamar a una función de controlador desde la función de enlace de otra directiva. Por ejemplo, tiene 3 directivas personalizadas

<animal>
<panther>
<leopard></leopard>
</panther> 
</animal>

y quieres acceder al animal desde dentro de la directiva "leopard".

http://egghead.io/lessons/angularjs-directive-communication será útil saber acerca de la comunicación entre directivas

compilar la función -

1. se llama antes del controlador y la función de enlace.
2. En la función de compilación, tiene la plantilla DOM original para que pueda realizar cambios en el DOM original antes de que AngularJS cree una instancia de la misma y antes de que se cree un alcance
3. ng-repeat es un ejemplo perfecto: la sintaxis original es un elemento de plantilla, los elementos repetidos en HTML son instancias
4. Puede haber múltiples instancias de elementos y solo un elemento de plantilla
5. El alcance aún no está disponible.
6. La función de compilación puede devolver la función y el objeto.
7. devolver una función (posterior al enlace) - es equivalente a registrar la función de enlace a través de la propiedad de enlace del objeto de configuración cuando la función de compilación está vacía.
8. devolver un objeto con funciones registradas a través de las propiedades pre y post: le permite controlar cuándo se debe llamar a una función de enlace durante la fase de enlace. Ver información sobre las funciones de pre-vinculación y post-vinculación a continuación.

sintaxis

function compile(tElement, tAttrs, transclude) { ... }

controlador

1. llamado después de la función de compilación
2. el alcance está disponible aquí
3. se puede acceder a través de otras directivas (ver requerimiento de atributo)

Pre - enlace

1. La función de enlace es responsable de registrar los escuchas de DOM y de actualizar el DOM. Se ejecuta después de que la plantilla ha sido clonada. Aquí es donde se pondrá la mayor parte de la lógica directiva.

2. Puede actualizar el dom en el controlador usando angular.element pero esto no se recomienda ya que el elemento se proporciona en la función de enlace

3. La función de enlace previo se usa para implementar la lógica que se ejecuta cuando angular js ya ha compilado los elementos secundarios, pero antes de que se haya llamado a cualquiera de los enlaces posteriores del elemento secundario

post-link

1. directiva que solo tiene función de enlace, angular trata la función como un enlace posterior.

2. la publicación se ejecutará después de la compilación, el controlador y la función de enlace previo, por lo que este es el lugar más seguro y predeterminado para agregar la lógica directiva.