在使用oclazyload、uigrid和nganimate时，$$animateJs不是函数

Question

我使用的是Typescript 1.7、AngularJS 1.5.7、oclazyload 1.0.9、ui-grid 3.2.5、ui-router 0.3.1、requirejs 2.2.0

首先，在我从Angular 1.4.3升级到1.5.7之前，一切都很正常

在我的代码中，我从require配置中引入了类似这样的源代码：

shim: {
    'angular': {
        exports: 'angular',
        deps: ['Scripts/RequireJS/V.2.2.0/domReady!']
    },
    'ngSanitize': {
        deps: ['angular']
    },
    'ngAnimate': {
        deps: ['angular']
    },
    'ngTouch': {
        deps: ['angular']
    },
    'uiRouter': {
        deps: ['angular', 'ocLazyLoad']
    },
    'uiBootstrapTpls': {
        deps: ['angular']
    },
    'ocLazyLoad': {
        deps: ['angular', 'ngAnimate']
    },

完成require调用后，我配置angular，然后手动调用bootstrap。

用户进入登录页面，登录，然后转到主页。主页有一个ui-grid，所以我们延迟加载( oc lazy loader )的状态改变如下：

 $ocLazyLoad.load('uiGrid');

注意: uiGrid在angular模块配置调用中的配置如下：

$ocLazyLoadProvider.config({
                events: true,
                jsLoader: requirejs,
                serie: true,
                modules: [

                    {
                        name: 'uiGrid',
                        files: ['Scripts/AngularUIGrid/V.3.2.5/ui-grid.min']

                    }

现在使用Angular 1.5.7这一切都很好，但是如果我重新加载页面，我会得到这样的结果：

TypeError: $$animateJs is not a function\n    
at prepareAnimation (http://myServer/Scripts/Angular/V.1.5.7/angular-animate.js?bust=2016_6_12_12_24:2152:14)\n    
at initDriverFn (http://myServer/Scripts/Angular/V.1.5.7/angular-animate.js?bust=2016_6_12_12_24:2136:16)\n    
at invokeFirstDriver (http://myServer/Scripts/Angular/V.1.5.7/angular-animate.js?bust=2016_6_12_12_24:3234:24)\n    
at Array.triggerAnimationStart (http://myServer/Scripts/Angular/V.1.5.7/angular-animate.js?bust=2016_6_12_12_24:3080:33)\n    
at nextTick (http://myServer/Scripts/Angular/V.1.5.7/angular-animate.js?bust=2016_6_12_12_24:423:15)\n    
at scheduler (http://myServer/Scripts/Angular/V.1.5.7/angular-animate.js?bust=2016_6_12_12_24:393:5)\n    
at Array.<anonymous> (http://myServer/Scripts/Angular/V.1.5.7/angular-animate.js?bust=2016_6_12_12_24:3102:9)\n    
at Scope.$digest (http://myServer/Scripts/Angular/V.1.5.7/angular.js?bust=2016_6_12_12_24:17338:55)\n    
at Scope.$apply (http://myServer/Scripts/Angular/V.1.5.7/angular.js?bust=2016_6_12_12_24:17553:24)\n    
at done (http://myServer/Scripts/Angular/V.1.5.7/angular.js?bust=2016_6_12_12_24:11698:47)

这不会发生在1.4.3 Angular版本中。

我粗略地看了一下，发现发生这种情况是因为在angular-animate.js中，$$animateJs的DI是undefined...therefore所显示的错误消息

var $$AnimateJsDriverProvider = ['$$animationProvider',     function($$animationProvider) {
  $$animationProvider.drivers.push('$$animateJsDriver');
  this.$get = ['$$animateJs', '$$AnimateRunner', function ($$animateJs,     $$AnimateRunner) {

oclazyload是问题所在吗?我稍微看了一下，不知道它对bootstrap和module的修饰方式是否有帮助？

提前感谢您的帮助。

Answer 1

ui.grid依赖于ngAnimate，因此您需要在加载ui.grid之前加载它。

resolve: helper.resolveFor('ngAnimate','ui.grid')

希望这能有所帮助。