6

我正在使用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']
}]);

现在我尝试在我的应用程序中加载 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'
                        ]
         }]
    });

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

.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']);
                   }]
            }
        })

尽管'momentjs'首先定义了该模块,但我仍然收到错误消息:Uncaught ReferenceError: moment is not defined

如果我放入moment.js模块'ui.calendar'它可以工作,但我想单独加载它,因为我的应用程序中有另一个视图,我只使用 moment.js 并且不需要所有依赖项。

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

先感谢您。

4

2 回答 2

3

当您想在每个单独的状态下一个接一个地加载模块时,您可以使用 amers answer 。放:

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

如果您想始终加载系列中的模块,您可以设置全局参数serie

$ocLazyLoadProvider.config({
    serie: true,
    modules: [{
        ...
    }]
于 2017-10-10T09:07:24.083 回答
1

是的,你可以做到:

   $ocLazyLoad.load(['momentjs','ui.calendar','ngCkeditor'], {serie: true}).then(function() {
         // done..
    });
于 2016-01-12T21:58:36.057 回答