无法从角度检索喷油器

我有两个模块的应用程序:

angular.module('components', []).directive('foo', function () { return {};});
angular.module('gaad', ['components']);

这里有一些与这些模块相关的指令。 该应用程序工作正常。 但是当我试图检索模块gaad注入器时:

var injector = angular.injector(['gaad', 'components']); //called after 'gaad' module initialization

错误被抛出:

Uncaught Error: Unknown provider: $compileProvider from components 

该应用程序现在相当大,我不知道应该在哪里寻找错误。 所以我的问题是: 什么可能是我的问题的原因?

编辑:我能够复制我的问题:http://jsfiddle.net/selbh/ehmnt/11/


在回答问题之前,我们需要注意的是, 每个应用程序只有一个喷油器实例,而不是每个模块 。 从这个意义上说,不可能为每个模块检索一个喷油器。 当然,如果我们采用顶级模块,它代表了整个应用程序。 在这个意义上,应用程序和顶级模块似乎是等价的。 这可能看起来像一个微妙的差异,但重要的是理解,以充分和正确地回答这个问题。

接下来,从我可以理解的你想要检索$injector而不是创建它的新实例。 问题是angular.injector会为指定为参数的模块(应用程序)创建一个新的$injector实例。 这里主要的AngularJS模块(ng)必须明确指定。 所以,在这个代码示例中:

var injector = angular.injector(['gaad', 'components']);

您试图从'gaad'和'components'模块中定义的组件创建一个新的注入器,显然$compileProvider没有在您的自定义模块中定义。 ng模块添加到列表中将通过创建一个新的注入器来“解决”问题 - 这可能不会发生。

要实际检索与正在运行的应用程序关联的注入器实例,我们可以使用2种方法

  • 从AngularJS JavaScript中,最简单的解决方案只是注入$injector实例:http://docs.angularjs.org/api/angular.injector
  • 从AngularJS世界的外部调用angular.element([DOM element]).injector()其中[DOM element]是定义了ng-app的dome元素(或者此元素的任何子元素)。 更多信息在这里:http://docs.angularjs.org/api/angular.element
  • 这里是jsFiddle显示注射器检索的两种方法:http://jsfiddle.net/xaQzb/

    另请注意,在单元测试之外,直接使用$injector并不是很常见的情况。 从AngularJS世界以外检索AngularJS服务可能是有用的想法。 更多信息:从传统代码调用Angular JS。


    看来你还需要在注入器中包含ng。

    var injector = angular.injector(['ng', 'b', 'a']);
    

    来自:AngularJS:注射器

    ng模块必须明确添加。


    问题出在Angular代码的执行流程中。 要集成@ pkozlowski.opensource的答案和相关注释,请注意$injector模块代码执行后, $injector属性可用于DOM元素,以便在访问该属性时(如尝试console.log时),财产仍然是undefined

    您可以通过简单地设置一个0超时来执行日志功能来解决这个问题(即不需要明确的毫秒延迟)。 这个hack的工作原理是当堆栈为空时执行日志功能,也就是说,当Angular的bootstrapping结束并且$injector属性可用于DOM元素时。

    Angular的另一个(也许更好的)解决方案是将$injector代码包含在运行块中(另请参阅相关的API)。 $injector可以作为普通服务轻松注入到初始化函数中。 这可以起作用,因为当所有引导程序终止时,运行块都会排队并异步执行。

    在下面你可以找到两个小提琴,每个解决方案都有一个小提琴。

    0超时jsFiddle

    运行块jsFiddle

    编辑

    另外,通常不需要显式加载ng模块。 在正常情况下, ng模型已经自动加载,除非你想执行Angular代码的手动引导。 在其中一个答案中引用的文档(不幸地)指的是Angular的手动引导过程,当你必须手动创建注入器并告诉它你要加载哪些模块时

    链接地址: http://www.djcxy.com/p/77547.html

    上一篇: Can't retrieve the injector from angular

    下一篇: Why use a service?