AngularJS 模块依赖注入与父模块共享它的依赖

Question

我有一个 AngularJS 模块：

angular.module("app", ['ui.bootstrap', 'ngRoute', 'ngGridPanel']).config(function($routeProvider) {

如您所见，它通过依赖注入包含ngGridPanel。

这里是ngGridPanel的模块/指令的定义：

angular.module('ngGridPanel', ['ngAnimate']).directive('gridPanel', ['$animate', '$compile', '$window', '$document', '$timeout', function ($animate, $compile, $window, $document, $timeout) {

如您所见，它指的是ngAnimate。

我遇到的问题是，一旦我将ngGridPanel 注入我的应用程序，我的应用程序中的每个元素都会突然尝试动画化。

现在，described in this Angular.js GitHub issue、ngAnimate 将假设所有内容都应该是动画的。一旦我意识到这是预期的行为，我就意识到我从来没有将 ngAnimate 包含在我的应用程序模块中。

那么为什么它会影响我的整个应用程序？不应该只在属于ngGridPanel模块的指令中生效吗？

那么ngAnimate 是如何影响父模块作用域的呢？这正常吗？

---

旁注：此时我什至还没有使用ngGridPanel 指令。我只是将它注入到我的应用程序中。

旁注 2： 在我的应用中实现类名过滤器 ($animateProvider.classNameFilter(/enable-animate/);) 后，我的所有元素上的动画都停止了，但在 ngGridPanel 指令中仍然可以工作必须在任何地方添加enable-animate 类。

Answer 1

如果你依赖于 ngGridPanel，而 ngGridPanel 依赖于 ngAnimate，那么你也依赖于 ngAnimate。

这对你来说就像你定义你的应用一样 angular.module("app", ['ui.bootstrap', 'ngRoute', 'ngGridPanel', 'ngAnimate']) .

至于您的旁注 2，他们似乎也将其配置为使用 .classNameFilter() 之类的东西，这样如果他们的库的用户决定以不同的方式配置它，动画就不会中断，例如您做过。我对 ngAnimate 了解不多，所以这只是一种预感。