Aspectos internos de AngularJS en profundidad

Patrones de diseño de interfaces inteligentes, vídeo de 10h + formación UX

Implemente rápidamente. Implementar inteligentemente

Índice

¿De qué tipo de ámbitos estamos hablando?
1. Herencia de alcance en AngularJS
2. Obteniendo las propiedades de alcance interno de AngularJS
Examinando las partes internas de un alcance en AngularJS

Al acercarse a AngularJS por primera vez, la interacción entre ámbitos, directivas y controladores es lo que inmediatamente se vuelve (y sigue siendo) confuso para la mayoría. Una vez que surge la confusión, comienzas a aprender sobre los conceptos avanzados, que también son increíblemente complejos. En este artículo, Nicolas Bevacqua navegará por la marisma que son los alcances de AngularJS y el ciclo de vida de una aplicación AngularJS, al tiempo que proporciona una lectura divertida, informativa y en profundidad.

AngularJS presenta una cantidad notable de opciones de diseño interesantes en su código base. Dos casos particularmente interesantes son la forma en que funcionan los ámbitos y cómo se comportan las directivas.

Lo primero que se le enseña a cualquiera cuando se acerca a AngularJS por primera vez es que las directivas están destinadas a interactuar con el DOM, o cualquier cosa que manipule el DOM por usted, como jQuery (¡ supere ya jQuery !). Sin embargo , lo que inmediatamente se vuelve (y sigue siendo) confuso para la mayoría es la interacción entre ámbitos, directivas y controladores .

Una vez que surge la confusión, comienza a aprender sobre los conceptos avanzados: el ciclo de resumen, los ámbitos aislados, la transclusión y las diferentes funciones de enlace en las directivas. Estos también son increíblemente complejos. No cubriré las directivas en este artículo, pero se abordarán en el seguimiento.

Este artículo navegará por la marisma que son los alcances de AngularJS y el ciclo de vida de una aplicación AngularJS, al tiempo que proporciona una lectura divertida, informativa y en profundidad.

(El listón es alto, pero los alcances son bastante difíciles de explicar. Si voy a fracasar estrepitosamente, ¡al menos haré algunas promesas más que no puedo cumplir!)

Si la siguiente figura parece excesivamente alucinante, entonces este artículo podría ser para usted.

(Descargo de responsabilidad: este artículo se basa en la versión 1.3.0 de AngularJS ).

AngularJS utiliza ámbitos para abstraer la comunicación entre directivas y el DOM. También existen alcances a nivel de controlador. Los ámbitos son objetos JavaScript antiguos (POJO) que AngularJS no manipula en gran medida. Solo agregan un montón de propiedades "internas", precedidas de uno o dos $símbolos. Los que tienen el prefijo $$no son necesarios con tanta frecuencia y su uso suele ser un olor a código, que puede evitarse si se tiene una comprensión más profunda del ciclo de resumen.

¿De qué tipo de ámbitos estamos hablando?

En la jerga de AngularJS, un "alcance" no es algo a lo que uno podría estar acostumbrado cuando piensa en código JavaScript o incluso en programación en general. Por lo general, los ámbitos se utilizan para hacer referencia a la bolsa en un fragmento de código que contiene el contexto, las variables, etc.

(En la mayoría de los lenguajes, las variables se guardan en bolsas imaginarias, que se definen mediante llaves ( {}) o bloques de código. Esto se conoce como " alcance de bloque ". JavaScript, por el contrario, se ocupa del " alcance léxico ", lo que básicamente significa que las bolsas están definidas por funciones, o el objeto global, en lugar de por bloques de código. Las bolsas pueden contener cualquier número de bolsas más pequeñas. Cada bolsa puede acceder a los dulces (variables dulces, dulces) dentro de su bolsa principal (y en la bolsa principal de su padre, etc.), pero no pueden hacer agujeros en bolsas más pequeñas o para niños).

Como ejemplo rápido y sencillo, examinemos la función a continuación.

function eat (thing) { console.log('Eating a ' + thing);}function nuts (peanut) { var hazelnut = 'hazelnut'; function seeds () { var almond = 'almond'; eat(hazelnut); // I can reach into the nuts bag! } // Almonds are inaccessible here. // Almonds are not nuts.}

No me extenderé más en thisel tema , porque estos no son los ámbitos a los que la gente se refiere cuando habla de AngularJS. Consulte "¿ De dónde thisprovienen las palabras clave?" ” si desea obtener más información sobre los alcances en el contexto del lenguaje JavaScript.

Herencia de alcance en AngularJS

Los alcances en AngularJS también son contexto, pero en los términos de AngularJS. En AngularJS, un alcance está asociado con un elemento (y todos sus elementos secundarios), mientras que un elemento no está necesariamente asociado directamente con un alcance. A los elementos se les asigna un alcance de una de las tres formas siguientes.

La primera forma es si un controlador o una directiva crea un alcance en un elemento (las directivas no siempre introducen nuevos alcances).

nav ng-controller='menuCtrl'

En segundo lugar, si un alcance no está presente en el elemento, entonces se hereda de su padre.

nav ng-controller='menuCtrl' a ng-click='navigate()'Click Me!/a !-- also nav's scope --/nav

En tercer lugar, si el elemento no forma parte de un ng-app, entonces no pertenece a ningún ámbito en absoluto.

head h1Pony Deli App/h1/headmain ng-app='PonyDeli' nav ng-controller='menuCtrl' a ng-click='navigate()'Click Me!/a /nav/main

Para determinar el alcance de un elemento, intente pensar en los elementos de forma recursiva, de adentro hacia afuera, siguiendo las tres reglas que acabo de describir. ¿Crea un nuevo alcance? Ese es su alcance. ¿Tiene un padre? Entonces revisa a los padres. ¿No es parte de un ng-app? Mala suerte, no hay alcance.

Puedes (y definitivamente deberías) usar la magia de las herramientas de desarrollo para determinar fácilmente el alcance de un elemento.

Obteniendo las propiedades de alcance interno de AngularJS

Analizaré algunas propiedades en un ámbito típico para presentar ciertos conceptos, antes de pasar a explicar cómo funcionan y se comportan los resúmenes internamente. También te contaré cómo llego a estas propiedades. Primero, abriré Chrome y navegaré hasta la aplicación en la que estoy trabajando, que está escrita en AngularJS. Luego, inspeccionaré un elemento y abriré las herramientas de desarrollador.

(¿Sabías que eso $0te da acceso al último elemento seleccionado en el panel "Elementos"? $1Te da acceso al elemento seleccionado previamente, y así sucesivamente. Pronostico que lo usarás $0más, particularmente cuando trabajes con AngularJS).

Para cualquier elemento DOM determinado, angular.elementlo envuelve en jQuery o jqLite, la pequeña versión mini de jQuery . Una vez que está empaquetado, obtienes acceso a una scope()función que regresa, ¡lo has adivinado! - el alcance de AngularJS asociado con ese elemento. Combinando eso con $0, me encuentro usando el siguiente comando con bastante frecuencia.

angular.element($0).scope()

(Por supuesto, si sabe que utilizará jQuery, $($0).scope()funcionará igual. Y angular.elementfunciona siempre, independientemente de si jQuery está disponible).

Luego, puedo inspeccionar el alcance, afirmar que es el alcance que esperaba y afirmar si los valores de la propiedad coinciden con lo que esperaba. ¡Súper útil! Veamos qué propiedades especiales están disponibles en un ámbito típico, aquellas que tienen el prefijo uno o más signos de dólar.

for(o in $($0).scope())o[0]=='$'console.log(o)

Eso es lo suficientemente bueno. Repasaré todas las propiedades, las agruparé por funcionalidad y repasaré cada parte de la filosofía de alcance de AngularJS.

Examinando las partes internas de un alcance en AngularJS

A continuación, enumero las propiedades obtenidas por ese comando, agrupadas por área de funcionalidad. Comencemos con los básicos, que simplemente brindan navegación de alcance.

[$id](https://github.com/angular/angular.js/blob/v1.3.0/src/ng/rootScope.js#L127)identifica de forma única el alcance
[$root](https://github.com/angular/angular.js/blob/v1.3.0/src/ng/rootScope.js#L131)alcance raíz
[$parent](https://github.com/angular/angular.js/blob/v1.3.0/src/ng/rootScope.js#L217)ámbito principal, o nullsiscope == scope.$root
[$$childHead](https://github.com/angular/angular.js/blob/v1.3.0/src/ng/rootScope.js#L223)primer ámbito secundario, si lo hubiera, onull
[$$childTail](https://github.com/angular/angular.js/blob/v1.3.0/src/ng/rootScope.js#L221)último ámbito secundario, si lo hubiera, onull
[$$prevSibling](https://github.com/angular/angular.js/blob/v1.3.0/src/ng/rootScope.js#L218)alcance del hermano anterior, si lo hubiera, onull
[$$nextSibling](https://github.com/angular/angular.js/blob/v1.3.0/src/ng/rootScope.js#L220)alcance del siguiente hermano, si lo hubiera, onull

No hay sorpresas aquí. Navegar por ámbitos como este sería una completa tontería. A veces, acceder al $parentalcance puede parecer apropiado, pero siempre hay formas mejores y menos acopladas de lidiar con la comunicación de los padres que vincular estrechamente los alcances de las personas. Una de esas formas es utilizar detectores de eventos, ¡nuestro próximo lote de propiedades de alcance!

Modelo de eventos en alcance AngularJS

Las propiedades que se describen a continuación nos permiten publicar eventos y suscribirnos a ellos. Este es un patrón conocido como PubSub , o simplemente eventos.

[$$listeners](https://github.com/angular/angular.js/blob/v1.3.0/src/ng/rootScope.js#L1092)oyentes de eventos registrados en el alcance
[$on(evt, fn)](https://github.com/angular/angular.js/blob/v1.3.0/src/ng/rootScope.js#L1089-L1109)adjunta un detector de eventos fnllamadoevt
[$emit(evt, args)](https://github.com/angular/angular.js/blob/v1.3.0/src/ng/rootScope.js#L1134-L1182)evento de disparos evt, rugiendo hacia arriba en la cadena del alcance, activándose en el alcance actual y todos $parentlos s, incluido el$rootScope
[$broadcast(evt, args)](https://github.com/angular/angular.js/blob/v1.3.0/src/ng/rootScope.js#L1206-L1258)dispara el evento evt, que se activa en el alcance actual y todos sus elementos secundarios

Cuando se activa, a los detectores de eventos se les pasa un eventobjeto y todos los argumentos se pasan a la función $emito $broadcast. Hay muchas maneras en que los eventos de alcance pueden aportar valor.

Una directiva podría utilizar eventos para anunciar que ha sucedido algo importante. Consulte el ejemplo de directiva a continuación, donde se puede hacer clic en un botón para anunciar que tiene ganas de comer algún tipo de alimento.

angular.module('PonyDeli').directive('food', function () { return { scope: { // I'll come back to directive scopes later type: '=type' }, template: 'button ng-click="eat()"I want to eat some {{type}}!/button', link: function (scope, element, attrs) { scope.eat = function () { letThemHaveIt(); scope.$emit('food.order, scope.type, element); }; function letThemHaveIt () { // Do some fancy UI things } } };});

Yo espacio los nombres de mis eventos, y tú también deberías hacerlo. Evita colisiones de nombres y deja claro de dónde se originan los eventos o a qué evento se está suscribiendo. Imagine que tiene interés en el análisis y desea realizar un seguimiento de los clics en foodelementos mediante Mixpanel . En realidad, esa sería una necesidad razonable, y no hay ninguna razón por la que eso deba contaminar su directiva o su controlador. Podría elaborar una directiva que realice el seguimiento analítico de los clics en los alimentos por usted, de una manera bastante autónoma.

angular.module('PonyDeli').directive('foodTracker', function (mixpanelService) { return { link: function (scope, element, attrs) { scope.$on('food.order, function (e, type) { mixpanelService.track('food-eater', type); }); } };});

La implementación del servicio no es relevante aquí, porque simplemente envolvería la API del lado del cliente de Mixpanel. El HTML se vería como el que se muestra a continuación, y he incluido un controlador para contener todos los tipos de alimentos que quiero servir en mi tienda de delicatessen. La ng-appdirectiva también ayuda a AngularJS a iniciar automáticamente mi aplicación. Para completar el ejemplo, agregué una ng-repeatdirectiva para poder procesar toda mi comida sin repetirme; simplemente se recorrerá en bucle foodTypes, disponible en foodCtrlel alcance. Fotos Porno y actrices porno

ul ng-app='PonyDeli' ng-controller='foodCtrl' food-tracker li food type='type' ng-repeat='type in foodTypes'/li/ulangular.module('PonyDeli').controller('foodCtrl', function ($scope) { $scope.foodTypes = ['onion', 'cucumber', 'hazelnut'];});

El ejemplo completamente funcional está alojado en CodePen .

Ese es un buen ejemplo en papel, pero debes pensar si necesitas un evento al que cualquiera pueda suscribirse. ¿Quizás un servicio sirva? En este caso, podría ir en cualquier dirección. Se podría argumentar que necesitará eventos porque no sabe a quién más se suscribirá food.order, lo que significa que usar eventos estaría más preparado para el futuro. También se podría decir que la food-trackerdirectiva no tiene una razón de ser, porque no interactúa con el DOM o incluso con el alcance, excepto para escuchar un evento, que podría reemplazar con un servicio.

Ambos pensamientos serían correctos, en el contexto dado. A medida que más componentes necesiten ser food.orderconscientes, entonces podría quedar más claro que los eventos son el camino a seguir. Sin embargo, en realidad, los eventos son más útiles cuando realmente necesitas cerrar la brecha entre dos (o más) ámbitos y otros factores no son tan importantes.

Como veremos cuando inspeccionemos las directivas más de cerca en la próxima segunda parte de este artículo, los eventos ni siquiera son necesarios para que los ámbitos se comuniquen. Un ámbito secundario puede leer de su padre vinculándose a él y también puede actualizar esos valores.

(Rara vez hay una buena razón para organizar eventos que ayuden a los niños a comunicarse mejor con sus padres).

Los hermanos suelen tener más dificultades para comunicarse entre sí y, a menudo, lo hacen a través de un padre común. Esto generalmente se traduce en transmitir $rootScopey escuchar a los hermanos de interés, como se muestra a continuación.

body ng-app='PonyDeli' div ng-controller='foodCtrl' ul food-tracker li food type='type' ng-repeat='type in foodTypes'/li /ul button ng-click='deliver()'I want to eat that!/button /div div ng-controller='deliveryCtrl' span ng-show='received' A monkey has been dispatched. You shall eat soon. /span /div/bodyangular.module('PonyDeli').controller('foodCtrl', function ($rootScope) { $scope.foodTypes = ['onion', 'cucumber', 'hazelnut']; $scope.deliver = function (req) { $rootScope.$broadcast('delivery.request', req); };});angular.module('PonyDeli').controller('deliveryCtrl', function ($scope) { $scope.$on('delivery.request', function (e, req) { $scope.received = true; // deal with the request });});

Éste también está en CodePen .

Con el tiempo, aprenderá a inclinarse por eventos o servicios en consecuencia. Podría decir que debe usar eventos cuando espera que los modelos de vista cambien en respuesta eventy que debe usar servicios cuando no espera cambios en los modelos de vista. A veces, la respuesta es una combinación de ambas: una acción desencadena un evento que llama a un servicio o un servicio que transmite un evento en $rootScope. Depende de la situación, y debes analizarla como tal, en lugar de intentar encontrar una solución elusiva y única para todos.

Si tiene dos componentes que se comunican a través de $rootScope, es posible que prefiera utilizar $rootScope.$emit(en lugar de $broadcast) y $rootScope.$on. De esa manera, el evento solo se propagaría entre $rootScope.$$listeners, y no perdería tiempo recorriendo a cada hijo de $rootScope, que usted sabe que no tendrá oyentes para ese evento. A continuación se muestra un servicio de ejemplo que se utiliza $rootScopepara proporcionar eventos sin limitarse a un alcance particular. Proporciona un subscribemétodo que permite a los consumidores registrar detectores de eventos y podría hacer cosas internamente que desencadenen ese evento.

angular.module('PonyDeli').factory("notificationService", function ($rootScope) { function notify (data) { $rootScope.$emit("notificationService.update", data); } function listen (fn) { $rootScope.$on("notificationService.update", function (e, data) { fn(data); }); } // Anything that might have a reason // to emit events at later points in time function load () { setInterval(notify.bind(null, 'Something happened!'), 1000); } return { subscribe: listen, load: load };});

¡Lo adivinaste! Éste también está en CodePen .

Basta de bromas sobre eventos versus servicios. ¿Pasamos a otras propiedades?

Digerir conjuntos de cambios

Comprender este proceso intimidante es la clave para comprender AngularJS.

AngularJS basa sus funciones de enlace de datos en un bucle de verificación sucia que rastrea los cambios y activa eventos cuando estos cambian. Esto es más simple de lo que parece. No realmente. ¡Es! Repasemos rápidamente cada uno de los componentes principales del $digestciclo. Primero, está el scope.$digestmétodo, que digiere recursivamente los cambios en un ámbito y sus hijos.

[$digest()](https://github.com/angular/angular.js/blob/v1.3.0/src/ng/rootScope.js#L710)ejecuta el $digestbucle de verificación sucia
[$$phase](https://github.com/angular/angular.js/blob/v1.3.0/src/ng/rootScope.js#L1271)fase actual del ciclo de digestión, una de[null, '$apply', '$digest']

Debe tener cuidado al activar resúmenes, porque intentar hacerlo cuando ya está en una fase de resumen provocaría que AngularJS explotara en una misteriosa neblina de fenómenos inexplicables. En otras palabras, identificar la causa raíz del problema sería bastante difícil.

Veamos lo que dice la documentación sobre $digest.

"Procesa todos los observadores del alcance actual y sus hijos. Debido a que el oyente de un observador puede cambiar el modelo, $digest() sigue llamando a los observadores hasta que no se activan más oyentes. Esto significa que es posible entrar en un infinito bucle. Esta función se ejecutará 'Maximum iteration limit exceeded.'si el número de iteraciones excede 10. Por lo general, no se llama a $digest() directamente en los controladores o en las directivas. En su lugar, se debe llamar a $apply() (normalmente desde dentro de una directiva), lo que forzará un $digest()".

Entonces, a $digestprocesa a todos los observadores y luego procesa los observadores que esos observadores activan, hasta que nada más activa una vigilancia. Quedan dos preguntas por responder para que podamos entender este bucle.

¡¿Qué diablos es un “observador”?!
¿Qué desencadena un $digest?!

Las respuestas a estas preguntas varían enormemente en términos de complejidad, pero mantendré mis explicaciones lo más simples posible para que sean claras. Comenzaré hablando de los observadores y dejaré que ustedes saquen sus propias conclusiones.

Si ha leído hasta aquí, probablemente ya sepa qué es un observador. Probablemente hayas usado scope.$watch, y tal vez incluso hayas usado scope.$watchCollection. La $$watcherspropiedad tiene a todos los vigilantes a la vista.

[$watch(watchExp, listener, objectEquality)](https://github.com/angular/angular.js/blob/v1.3.0/src/ng/rootScope.js#L356)agrega un oyente de vigilancia al alcance
[$watchCollection](https://github.com/angular/angular.js/blob/v1.3.0/src/ng/rootScope.js#L530)observa elementos de matriz o propiedades de mapa de objetos
[$$watchers](https://github.com/angular/angular.js/blob/v1.3.0/src/ng/rootScope.js#L383)contiene todos los relojes asociados con el alcance

Los observadores son el aspecto más importante de las capacidades de enlace de datos de una aplicación AngularJS, pero AngularJS necesita nuestra ayuda para activar esos observadores; de lo contrario, no podrá actualizar adecuadamente las variables vinculadas a datos. Considere el siguiente ejemplo.

body ng-app='PonyDeli' ul ng-controller='foodCtrl' li ng-bind='prop'/li li ng-bind='dependency'/li /ul/bodyangular.module('PonyDeli').controller('foodCtrl', function ($scope) { $scope.prop = 'initial value'; $scope.dependency = 'nothing yet!'; $scope.$watch('prop', function (value) { $scope.dependency = 'prop is "' + value + '"! such amaze'; }); setTimeout(function () { $scope.prop = 'something else'; }, 1000);});

Entonces, tenemos ‘initial value’y esperaríamos que la segunda línea HTML cambiara ‘prop is “something else”! such amaze’después de un segundo, ¿verdad? Aún más interesante, ¡al menos esperarías que la primera línea cambiara a ‘something else’! ¿Por qué no? Eso no es un observador… ¿o sí?

En realidad, mucho de lo que haces en el marcado HTML termina creando un observador. En este caso, cada ng-binddirectiva creó un observador en la propiedad. Actualizará el HTML de licuando sea propy dependencycambiará, de manera similar a cómo nuestro reloj cambiará la propiedad en sí.

De esta manera, ahora puede pensar que su código tiene tres relojes, uno para cada ng-binddirectiva y el otro en el controlador. ¿Cómo se supone que AngularJS sabe que la propiedad se actualiza después del tiempo de espera? Puede recordarle a AngularJS una actualización de la propiedad agregando un resumen manual a la timeoutdevolución de llamada.

setTimeout(function () { $scope.prop = 'something else'; $scope.$digest();}, 1000);

Configuré un CodePen sin$digest y uno que lo hace$digest después del tiempo de espera. Sin embargo, la forma más AngularJS de hacerlo sería utilizar el $timeoutservicio en lugar de setTimeout. Proporciona cierto manejo de errores y se ejecuta $apply().

$timeout(function () { $scope.prop = 'something else';}, 1000);

[$apply(expr)](https://github.com/angular/angular.js/blob/v1.3.0/src/ng/rootScope.js#L1018-L1033)analiza y evalúa una expresión y luego ejecuta el $digestbucle en$rootScope

Además de ejecutar el resumen en cada ámbito, $applytambién proporciona funcionalidad de manejo de errores. Si está intentando ajustar el rendimiento, entonces $digestpodría estar justificado su uso, pero me mantendría alejado de él hasta que se sienta realmente cómodo con el funcionamiento interno de AngularJS. En realidad, sería necesario llamar $digest()manualmente muy pocas veces; $applycasi siempre es una mejor opción.

Volvemos ahora a la segunda pregunta.

¿Qué desencadena un $digest?!

Los resúmenes se activan internamente en lugares estratégicos de todo el código base de AngularJS. Se activan directamente o mediante llamadas a $apply(), como hemos observado en el $timeoutservicio. La mayoría de las directivas, tanto las que se encuentran en el núcleo de AngularJS como las que están disponibles, activan resúmenes. Los resúmenes activan a sus observadores y los observadores actualizan su interfaz de usuario. Esa es la idea básica de todos modos.

Encontrará un recurso bastante bueno con las mejores prácticas en la wiki de AngularJS, que está vinculada al final de este artículo.

He explicado cómo $digestinteractúan los relojes y el bucle entre sí. A continuación, enumero las propiedades relacionadas con el $digestbucle que puede encontrar en un alcance. Estos le ayudan a analizar expresiones de texto a través del compilador de AngularJS o a ejecutar fragmentos de código en diferentes puntos del ciclo de resumen.

[$eval(expression, locals)](https://github.com/angular/angular.js/blob/v1.3.0/src/ng/rootScope.js#L922-L924)analizar y evaluar una expresión de alcance inmediatamente
[$evalAsync(expression)](https://github.com/angular/angular.js/blob/v1.3.0/src/ng/rootScope.js#L955-L967)analizar y evaluar una expresión en un momento posterior
[$$asyncQueue](https://github.com/angular/angular.js/blob/v1.3.0/src/ng/rootScope.js#L736-L744)cola de tareas asíncronas, consumida en cada resumen
[$$postDigest(fn)](https://github.com/angular/angular.js/blob/v1.3.0/src/ng/rootScope.js#L969-L971)se ejecuta fndespués del siguiente ciclo de resumen
[$$postDigestQueue](https://github.com/angular/angular.js/blob/v1.3.0/src/ng/rootScope.js#L970)métodos registrados con$$postDigest(fn)

¡Uf! Eso es todo. No fue tan malo, ¿verdad?

¡El alcance está muerto! ¡Viva el alcance!

Estas son las últimas propiedades de un alcance, de aspecto bastante aburrido. Se ocupan del ciclo de vida del alcance y se utilizan principalmente para fines internos, aunque $newen algunos casos es posible que desee crear alcances usted mismo.

[$$isolateBindings](https://github.com/angular/angular.js/blob/v1.3.0/src/ng/compile.js#L756)aislar enlaces de alcance (por ejemplo, { options: '@megaOptions' }muy internos
[$new(isolate)](https://github.com/angular/angular.js/blob/v1.3.0/src/ng/rootScope.js#L193)crea un ámbito secundario o un isolateámbito que no heredará de su padre
[$destroy](https://github.com/angular/angular.js/blob/v1.3.0/src/ng/rootScope.js#L857)elimina el alcance de la cadena de alcance; El alcance y los niños no recibirán eventos y los relojes ya no se dispararán.
[$$destroyed](https://github.com/angular/angular.js/blob/v1.3.0/src/ng/rootScope.js#L863)¿Se ha destruido el visor?

¿Aislar ámbitos? ¿Qué es esta locura? La segunda parte de este artículo está dedicada a las directivas y cubre isolatealcances, transclusión, funciones de enlace, compiladores, controladores de directivas y más. ¡Espéralo!

Otros recursos

Aquí hay algunos recursos adicionales que puede leer para ampliar su comprensión de AngularJS.

“ El camino angular ”, Nicolas Bevacqua
“ Antipatrones ”, AngularJS, GitHub
“ Mejores prácticas ”, AngularJS, GitHub
Ejemplo de TodoMVC AngularJS
Egghead.io: Entrenamiento en video breve con AngularJS , John Lindquist
"Usando scope.$watchy scope.$apply", StackOverflow

Comente cualquier problema relacionado con este artículo para que todos puedan beneficiarse de sus comentarios.

Otras lecturas

Aspectos internos de AngularJS en profundidad, parte 2
Una introducción a las pruebas unitarias en aplicaciones AngularJS
Por qué debería considerar React Native para su aplicación móvil
Automatización del desarrollo basado en guías de estilo

(ml, al, mrn)Explora más en

Codificación
Móvil
javascript
Angular

Tal vez te puede interesar:

Aspectos internos de AngularJS en profundidad

Aspectos internos de AngularJS en profundidad

Herencia de alcance en AngularJSObteniendo las propiedades de alcance interno de AngularJSModelo de eventos en alcance AngularJSDigerir conjuntos de cambios¡E

programar

es

https://pseint.es/static/images/programar-aspectos-internos-de-angularjs-en-profundidad-865-0.jpg

2024-05-20

Aspectos internos de AngularJS en profundidad — Aspectos internos de AngularJS en profundidad

Si crees que alguno de los contenidos (texto, imagenes o multimedia) en esta página infringe tus derechos relativos a propiedad intelectual, marcas registradas o cualquier otro de tus derechos, por favor ponte en contacto con nosotros en el mail [email protected] y retiraremos este contenido inmediatamente

Update cookies preferences