Recientemente estaba leyendo la Guía Autoritaria AngularJS. Debido a varias razones (principalmente porque no tengo dinero, lo odio, por lo que elegí descargar la versión electrónica en línea (porque no cuesta dinero, jaja ...). La fuente es bastante clara y el efecto general es bastante bueno. Sin embargo, cuando vi el número de página total en la esquina superior izquierda, 479 páginas ... 479 ... 479 ... 479 ... es cierto que es que mi pequeña corazón estaba penetrada, el tipo de cuerpo, el tipo que estaba petulgado. ¿Aprender pero no quieres aprender el número de página pero no quieres aprenderlo?
Afortunadamente, antes de leer libros electrónicos, era un poco básico. Había aprendido un poco de tiempo viendo videos, desde datos de dos vías hasta los servicios, y luego hasta el sistema de instrucciones, tenía más o menos contacto. Además, durante una asignación de selección de cursos especiales web, se construyó un sistema de gestión de clase de estudiante simple a través de Angularjs en el delantero y NodeJs en el backend y la mangosta en el backend. Como no tengo dinero, solo puedo colocarlo en Github. Dirección de Github: Sistema de gestión de estudiantes, bienvenido a Fork, vamos al tema a continuación ...
=============================================================================================================
Por lo general, hay tres formas de que un objeto obtenga control sobre su dependencia:
(1) crear dependencias internamente;
(2) referencias a través de variables globales;
(3) Pase a través de los parámetros cuando sea necesario.
La inyección de dependencia se logra de la tercera manera. Los otros dos métodos traerán diversos problemas, como contaminar el alcance global, dificultar el aislamiento, etc. La inyección de dependencia es un patrón de diseño que elimina las dependencias codificadas, para que las dependencias se puedan cambiar o eliminar en tiempo de ejecución.
La capacidad de modificar las dependencias en tiempo de ejecución es ideal para las pruebas porque nos permite crear un entorno aislado donde se pueden usar objetos burlados en lugar de objetos reales en el entorno de producción.
Desde una perspectiva funcional, la inyección de dependencia encontrará automáticamente la dependencia de antemano e informará el recurso dependiente del objetivo de inyección, para que el recurso pueda inyectarse inmediatamente cuando el objetivo lo necesite.
Al escribir componentes que dependen de otros objetos o bibliotecas, necesitamos describir las dependencias entre componentes. Durante el tiempo de ejecución, el inyector crea una instancia de la dependencia y es responsable de pasarlo al consumidor dependiente.
// Excelente ejemplo de la función de documentación angular someclass (greeter) {this.greeter = greeter;} someclass.prototype.greetname = function (name) {this.greeter.greet (name);}; // Tenga en cuenta que el código de muestra crea un controlador en el ámbito global, que no es una buena idea, es solo para la conveniencia de la demostración.Someclass puede acceder al Saludor interno en tiempo de ejecución, pero no le importa cómo obtener una referencia al Saludor. Para obtener una referencia a la instancia de salud, el creador de Someclass es responsable de construir sus dependencias y transmitirlas.
Por las razones anteriores, AngularJS utiliza $ injetor (servicio de inyectores) para gestionar consultas e instanciación de dependencias. De hecho, $ injetor es responsable de instanciar todos los componentes en AngularJS, incluidos los módulos, instrucciones y controladores de la aplicación.
En tiempo de ejecución, $ injetor es responsable de instancias de cualquier módulo cuando comience y pase todas las dependencias en las que necesita.
Por ejemplo, el siguiente código. Esta es una aplicación simple que declara un módulo y un controlador:
angular.module ('myApp', []). factory ('saluder', function () {return {greet: function (msg) {alert (msg);}}}). controler ('mycontroller', function ($ scope, greeter) {$ scope.sayhello = function () {greet.Greet ("Hello!");};});}Cuando Angularjs instancia este módulo, busca saludar y naturalmente pasa referencias a él:
<div ng-app = "myApp"> <div ng-concontroller = "mycontroller"> <button ng-click = "sayhello ()"> hola </botón> </div> </div>
Internamente, el proceso de procesamiento de AngularJS es el siguiente:
// Use el inyector para cargar la aplicación var inyector = angular.injector (['ng', 'myApp']); // Cargue el servicio de controlador $ a través del inyector var $ controler = injector.get ('$ controler'); // Cargue el controlador y pase en un alcance, al igual que AngularJS en el runtime var Scope = injector.get ('$ rootscope'); MyController = $ controler ('myController', {$ scope: scope});El código anterior no especifica cómo encontrar Greeter, pero funciona correctamente porque $ inyector será responsable de encontrarlo y cargarlo para nosotros.
AngularJS extrae la lista de parámetros de la función pasada durante la instancia a través de la función de anotado. Ingrese el siguiente código en las herramientas de desarrollador de Chrome para ver esta función:
> inyector.annotate (function ($ q, gooder) {}) ["$ q", "saludador"]En cualquier aplicación AngularJS, $ inyector está funcionando, ya sea que lo sepamos o no. Al escribir un controlador, si no se usa la etiqueta [] o se hace una declaración explícita, $ inyector intenta inferir dependencias por nombres de parámetros.
Declaración de inyección inferida
Si no hay una declaración explícita, AngularJS supone que el nombre del parámetro es el nombre de la dependencia. Por lo tanto, llamará internamente el método ToString () del objeto de función, analizará y extraerá la lista de parámetros de función e inyectará estos parámetros en la instancia de objeto a través de $ inyector. El proceso de inyección es el siguiente:
inyector.invoke (function ($ http, greeter) {});Tenga en cuenta que este proceso solo es aplicable al código sin comprimir y ofuscado, ya que AngularJS requiere una lista de parámetros sin comprimir sin comprimir para el análisis. Con este proceso de inferencia basado en nombres de parámetros, el orden de los parámetros es de poca importancia, porque AngularJS nos ayudará a inyectar propiedades en el orden correcto.
Inyectar declaraciones explícitamente
AngularJS proporciona métodos explícitos para definir claramente las dependencias que una función necesita usar cuando se llama. Declarar las dependencias de esta manera aún puede funcionar correctamente incluso si el código fuente está comprimido y el nombre del parámetro cambia. La propiedad $ inyect se puede utilizar para implementar la función de la inyección explícita de declaraciones. La propiedad $ inyección de un objeto de función es una matriz, el tipo de elemento de matriz es una cadena y sus valores son el nombre del servicio que debe inyectarse.
Aquí está el código de muestra:
var acontrollerFactory = function acontroller ($ scope, greeter) {console.log ("controlador cargado", salud); // ... controlador}; acontrollerFactory. $ inject = [$ scope ',' greome ']; // Greeter service console.log("greeter service");}// Our application controller angular.module('myApp', []).controller('MyController', aControllerFactory).factory('greeter', greeterService);// Get the injector and create a new scope var injector = angular.injector(['ng', 'myApp']),controller = inyector.get ('$ controlador'), rootscope = injector.get ('$ rootscope'), newsCope = RootsCope. $ new (); // Call Controller Controller ('MyController', {$ Scope: NewsCope});Para este método de declaración, el orden de los parámetros es muy importante, porque el orden de los elementos de matriz de inyección de $ debe corresponder uno por uno al orden de parámetros inyectados. Este método de declaración se puede ejecutar en código comprimido porque la información relevante de la declaración ya está vinculada a la función misma.
Declaración de inyección intra línea
La última forma de inyectar declaraciones proporcionadas por AngularJS es una declaración de inyección en línea que se puede usar en cualquier momento. Este método es en realidad un azúcar sintáctico, que es exactamente el mismo que el principio mencionado anteriormente para inyectar declaraciones a través de la propiedad $ inyección, pero nos permite pasar parámetros desde la línea cuando se define la función. Además, evita el uso de variables temporales durante el proceso de definición.
Al definir un objeto AngularJS, la declaración en línea nos permite pasar una matriz de parámetros directamente en lugar de una función. Los elementos de la matriz son cadenas, que representan los nombres de las dependencias que se pueden inyectar en el objeto. El último parámetro es el objeto en sí mismo de inyección de dependencia.
Los ejemplos son los siguientes:
Angular.module ('myApp'). Controler ('myController', ['$ scope', 'gooder', function ($ scope, greeter) {}]);Dado que lo que debe procesarse es una lista de cadenas, las declaraciones de inyección en línea también pueden ejecutarse normalmente en el código comprimido. Por lo general, se usa entre paréntesis y el símbolo [] que declara la matriz.
La inyección de dependencia AngularJS anterior es todo el contenido que comparto con usted. Espero que pueda darle una referencia y espero que pueda apoyar más a Wulin.com.