在lazyloaded模块中包含依赖项时无法初始化ocLazyLoad错误

时间:2017-08-24 09:38:42

标签: angularjs lazy-loading oclazyload

我正在尝试逐步加载模块。我创建了一个'lazyModule.js'文件,然后使用oclazyLoad加载这个模块。当我在这个lazyModule.js中定义myModule.js依赖项时,它会在控制台上抛出以下错误:

  

在bootstrap期间找不到模块,无法初始化ocLazyLoad。你应该总是使用ng-app指令或angular.boostrap   使用ocLazyLoad。

lazyModule.js

define([
    'angular',
    'components/infrastructure/myModule'
], function(angular) {
    'use strict';
    return angular.module('lazyModule',
        [
            'myModule'
        ]);
});

myModule.js

define([
    'angular',
    'ui-bootstrap',
    'ocLazyLoad'
], function initModule(angular) {
    'use strict';

    angular.module('html.myModule', [   'oc.lazyLoad']);
});

这是我懒惰加载lazyModule.js的方式:

initializeLazyModule: function(scope) {
                var template;
                try{
                    // checking for existing module
                    angular.module('lazyModule');
                    isLoaded=true;
                }catch(err) {
                    isLoaded=false;
                }
                if (!isLoaded) {
                    return require(['apps/controlCenter/lazyModule'], function() {
                        $ocLazyLoad.inject('lazyModule');
                        ControlCenterUtilities.checkAndApplyScope(scope);
                        $compile($('#my-module'))(scope);

                    });
   }

   else {
                   return;
   }
}

虽然,当我从myModule.js中删除oc.lazyLoad模块的依赖项时,控制台错误就会消失。

但是我没有选择从myModule中删除oc.lazyload模块依赖项,因为它会破坏其他一些直接使用我的模块但没有加载oclazyload的组件。

它基本上发生了因为oc.lazyload模块被注入两次。 请帮忙

1 个答案:

答案 0 :(得分:0)

我找到了解决方法。

如果oc.lazyLoad已经通过bootstrap角度模块加载,则

oc.lazyLoad不应包含在新角度模块创建的角度依赖性中。 只要它包含在新模块依赖项中,oc.lazyLoad就会尝试初始化它。

<强> lazyModule.js

   define([
        'angular',
        'components/infrastructure/myModule'
    ], function(angular) {
        'use strict';
         var dependentModules = [
         try {
           angular.module('oc.lazyLoad');
         } catch (moduleError) {
             dependentModules.push('oc.lazyLoad');
         }
         return angular.module('lazyModule', dependentModules);
    });