angularjs - ejemplos - No se puede recuperar el inyector desde angular
angularjs pdf (3)
Tengo esta aplicación con dos módulos:
angular.module(''components'', []).directive(''foo'', function () { return {};});
angular.module(''gaad'', [''components'']);
Hay un grupo de directivas asociadas con estos módulos que no incluyo aquí. La aplicación funciona bien. Sin embargo, cuando intento recuperar el inyector para el módulo gaad :
var injector = angular.injector([''gaad'', ''components'']); //called after ''gaad'' module initialization
el error es arrojado:
Uncaught Error: Unknown provider: $compileProvider from components
La aplicación es bastante grande ahora y no tengo idea de dónde debo buscar errores. Entonces mi pregunta es: ¿Cuál podría ser el motivo de mis problemas?
EDITAR: Pude replicar mi problema: http://jsfiddle.net/selbh/ehmnt/11/
El problema está en el flujo de ejecución del código de Angular. Para integrar la respuesta de @ pkozlowski.opensource y los comentarios relacionados, tenga en cuenta que la propiedad $injector está disponible para los elementos DOM después de que se ejecute el código del módulo, de modo que cuando acceda a la propiedad (como cuando intente console.log ) el la propiedad aún undefined estará undefined .
Puede resolver este problema simplemente configurando un tiempo de espera de 0 para la ejecución de la función de registro (es decir, no se necesita un retraso explícito en milisegundos). Este truco funciona porque la función de registro se ejecutará cuando la pila esté vacía, es decir, cuando el bootstrapping de Angular haya finalizado y la propiedad $injector esté disponible para los elementos DOM.
Otra solución (quizás mejor) en la jerga de Angular sería incluir su código de acceso $injector en un bloque de ejecución (ver también la API relacionada ). El $injector podría inyectarse fácilmente en la función de inicialización como un servicio normal. Esto funciona porque los bloques de ejecución se ponen en cola y se ejecutan de forma asíncrona cuando finaliza todo el arranque.
A continuación puede encontrar dos violines, uno para cada solución.
EDITAR
Además, generalmente no es necesario cargar explícitamente el módulo ng . En casos normales, el modelo ng ya está cargado automáticamente, a menos que desee realizar un arranque manual del código de Angular. La pieza de documentos a la que se hace referencia en una de las respuestas se refiere (implícitamente, desafortunadamente) al procedimiento manual de arranque de Angular, cuando tiene que crear manualmente el inyector y decirle qué módulos desea cargar
Parece que también debe incluir ng en el inyector.
var injector = angular.injector([''ng'', ''b'', ''a'']);
El módulo ng debe agregarse explícitamente.
Antes de responder a la pregunta, debemos tener en cuenta que solo hay una instancia de inyector por aplicación y no por módulo . En este sentido, no es posible recuperar un inyector por módulo. Por supuesto, si tomamos el módulo de nivel superior, representa la aplicación completa. En este sentido, una aplicación y un módulo de nivel superior parecen equivalentes. Puede parecer una diferencia sutil, pero es importante comprenderlo para poder responder de manera completa y adecuada a esta pregunta.
Luego, por lo que puedo entender, le gustaría recuperar $injector y no crear una nueva instancia de este. El hecho es que angular.injector creará una nueva instancia de $injector para los módulos (una aplicación) especificados como argumentos. Aquí el módulo principal de AngularJS (ng) debe especificarse explícitamente. Entonces, en este ejemplo de código:
var injector = angular.injector([''gaad'', ''components'']);
Estabas tratando de crear un nuevo inyector a partir de los componentes definidos en los módulos ''gaad'' y ''components'' y obviamente $compileProvider no está definido en tus módulos personalizados. Agregar el módulo ng a la lista "resolvería" el problema creando un nuevo inyector , algo que probablemente no desee que suceda.
Para recuperar realmente una instancia de inyector asociada a una aplicación en ejecución, podemos usar 2 métodos:
- desde AngularJS JavaScript, la solución más simple es solo inyectar la instancia de
$injector: http://docs.angularjs.org/api/angular.injector - desde fuera del mundo AngularJS - llame a
angular.element([DOM element]).injector()donde [elemento DOM] es un elemento domo donde se definió lang-app(o cualquier elemento secundario de este elemento). Más información aquí: http://docs.angularjs.org/api/angular.element
Aquí está el jsFiddle mostrando 2 métodos de recuperación del inyector: http://jsfiddle.net/xaQzb/
Tenga en cuenta también que el uso de $injector directamente no es un escenario muy común fuera de la unidad de prueba. Podría ser útil pensar para recuperar servicios AngularJS desde fuera del mundo de AngularJS. Más información aquí: llame a Angular JS desde el código heredado .