ocLazyLoad中的模块如何加载,并行或按顺序加载?

Ana*_*oly 6 lazy-loading angularjs oclazyload

我正在使用ocLazyLoad库来实现项目中所有依赖项的延迟加载.我知道默认情况下文件并行加载并按顺序加载我应该使用serie:true https://github.com/ocombe/ocLazyLoad/issues/47

这个线程我明白我可以串行加载模块:

是的,文件是并行加载的,如果你想同时使用多个模块并且它们需要彼此,你需要在不同的对象参数中定义它们:

$ocLazyLoad.load([{
    name: 'TestModule',
    files: ['testModule.js', 'testModuleCtrl.js', 'testModuleService.js']
},{
    name: 'AnotherModule',
    files: ['anotherModule.js']
}]);
Run Code Online (Sandbox Code Playgroud)

现在我尝试在我的应用程序中加载FullCalendar所需的所有依赖项,这是我的ocLazyLoad配置文件:

$ocLazyLoadProvider.config({
         debug: true,
         modules: [{
                name: 'ngCkeditor',
                files: [
                            'resources/bower_components/ng-ckeditor/libs/ckeditor/ckeditor.js',
                            'resources/bower_components/ng-ckeditor/ng-ckeditor.min.js',
                            'resources/bower_components/ng-ckeditor/ng-ckeditor.css'
                        ],
                serie: true
         },{
                name: 'ui.calendar',
                files: [
                        'resources/bower_components/fullcalendar/dist/fullcalendar.min.js',
                        'resources/bower_components/fullcalendar/dist/lang/he.js',
                        'resources/bower_components/fullcalendar/dist/gcal.js',
                        'resources/bower_components/angular-ui-calendar/src/calendar.js',
                        'resources/bower_components/fullcalendar/dist/fullcalendar.min.css'
                        ],
                serie: true
         },{
                name: 'ngFileUpload',
                files: [
                            'resources/bower_components/ng-file-upload/ng-file-upload.min.js'
                        ]
         },{
                name: 'momentjs',
                files: [
                            'resources/bower_components/moment/min/moment.min.js'
                        ]
         }]
    });
Run Code Online (Sandbox Code Playgroud)

这是我的路由器的一部分:

.state('schedule',{
            url: '/schedule',
            controller:     'ScheduleController',
            templateUrl:    'schedule.html',
            resolve: {
                  loginRequired: loginRequired,
                  loadMyCtrl: ['$ocLazyLoad', function($ocLazyLoad) {
                      // you can lazy load files for an existing module
                             return $ocLazyLoad.load(['momentjs','ui.calendar','ngCkeditor']);
                   }]
            }
        })
Run Code Online (Sandbox Code Playgroud)

尽管'momentjs'在第一个地方定义了该模块,但仍然会出现错误:Uncaught ReferenceError: moment is not defined

如果我把moment.js'ui.calendar'模块它的工作原理,但我想是因为我在我的应用程序的另一个观点,我只用moment.js,并不需要所有的依赖单独加载它.

所以,我的问题是,如何使模块(而不是文件)加载到系列中,而不是文件中,或者如果它们已经加载到系列中,是什么导致我的错误?

先感谢您.

ame*_*mer 1

是的,你可以这样做:

   $ocLazyLoad.load(['momentjs','ui.calendar','ngCkeditor'], {serie: true}).then(function() {
         // done..
    });
Run Code Online (Sandbox Code Playgroud)