La controllerfunción / objeto representa un modelo de abstracción-vista-controlador (MVC). Si bien no hay nada nuevo que escribir sobre MVC, sigue siendo la ventaja más significativa de angular: dividir las preocupaciones en piezas más pequeñas. Y eso es todo, nada más, por lo que si necesita reaccionar ante los Modelcambios que vienen de Viewla personaController adecuada para hacer ese trabajo.
La historia sobre la linkfunción es diferente, proviene de una perspectiva diferente a la MVC. Y es realmente esencial, una vez que queremos cruzar los límites de una controller/model/view (plantilla) .
Vamos a comenzar con los parámetros que se pasan a la linkfunción:
function link(scope, element, attrs) {
- El alcance es un objeto de alcance angular.
- element es el elemento envuelto en jqLite con el que coincide esta directiva.
- attrs es un objeto con los nombres de atributos normalizados y sus valores correspondientes.
Para poner el linkcontexto en contexto, debemos mencionar que todas las directivas están pasando por estos pasos del proceso de inicialización: compilar , vincular . Un extracto del libro de Brad Green y Shyam Seshadri Angular JS :
Fase de compilación (una hermana de enlace, mencionémosla aquí para obtener una imagen clara):
En esta fase, Angular recorre el DOM para identificar todas las directivas registradas en la plantilla. Para cada directiva, transforma el DOM en función de las reglas de la directiva (plantilla, reemplazar, transcluir, etc.) y llama a la función de compilación si existe. El resultado es una función de plantilla compilada,
Fase de enlace :
Para hacer que la vista sea dinámica, Angular ejecuta una función de enlace para cada directiva. Las funciones de enlace generalmente crean oyentes en el DOM o el modelo. Estos oyentes mantienen la vista y el modelo sincronizados en todo momento.
Un buen ejemplo de cómo usarlo linkse puede encontrar aquí: Creación de directivas personalizadas . Vea el ejemplo: Creación de una directiva que manipula el DOM , que inserta una "fecha-hora" en la página, que se actualiza cada segundo.
Solo un fragmento muy corto de esa rica fuente anterior, que muestra la manipulación real con DOM. Hay una función enganchada al servicio $ timeout, y también se borra en su llamada destructor para evitar pérdidas de memoria
.directive('myCurrentTime', function($timeout, dateFilter) {
function link(scope, element, attrs) {
...
// the not MVC job must be done
function updateTime() {
element.text(dateFilter(new Date(), format)); // here we are manipulating the DOM
}
function scheduleUpdate() {
// save the timeoutId for canceling
timeoutId = $timeout(function() {
updateTime(); // update DOM
scheduleUpdate(); // schedule the next update
}, 1000);
}
element.on('$destroy', function() {
$timeout.cancel(timeoutId);
});
...
$watch,$digesty$apply. "?