使用ocLazyLoad插件加載組件和其他依賴項

Question

我正在使用AngularJS和ocLazyLoad插件。我找不到解決我的問題的方法。

我已經創建了該組件的一個組分（命名爲component.js）和控制器（在單獨的文件中componentCtrl.js），然後我有常量，這是我在控制器使用（它太在分離的文件constants.js）。我需要加載這些文件。當我使用這樣的東西：

loadPlugin: function ($ocLazyLoad) { 
        return $ocLazyLoad.load(
         { 
          files: ['../componentCtrl.js','../constants.js',../,'component.js'] 
         },... 

我的依賴關係加載正常。但我需要更多視圖中的這個組件。然後，我必須一次又一次地寫這些代碼。在使用延遲加載函數之前，我可以定義這個資源數組嗎？

當我有模塊，這很簡單

$ocLazyLoadProvider.config({ 
    modules: [{ 
    name: 'TestModule', 
    files: ['source1', 'source2',..., 'sourceN'] 
    }] 
}); 

但是我沒有這個component.It的可能用這個插件特殊模塊？

Answer 1

你可以定義一些常量或全局變量，有添加所有組件文件是這樣的：

angular.module('app') 
     .constant('SIMPLE_COMPONENTS', { 
      comp1: ['../componentCtrl.js', '../constants.js', 'component.js'], 
      comp2: ['../componentCtrl2.js', '../constants2.js', 'component2.js'], 
      compfoo: ['../componentfoo.js', '../constantsbar.js', 'componentfoo.js'] 
     }); 

那麼喜歡你的狀態配置中定義一個函數：

function getMeFoo(src) { 
    return ['$ocLazyLoad', 'SIMPLE_COMPONENTS', function ($ocLazyLoad, SIMPLE_COMPONENTS) { 
     if (SIMPLE_COMPONENTS[src]) { 
      return $ocLazyLoad.load(SIMPLE_COMPONENTS[src]); 
     } 
    }] 
} 

現在只需使用它們在你的狀態配置中：

.state('app.foo', { 
    url: '/foo', 
    templateUrl: 'views/foo.html', 
    resolve: { 
     dep1: getMeFoo('comp1') 
    } 
}) 

.state('app.bar', { 
    url: '/bar', 
    templateUrl: 'views/bar.html', 
    resolve: { 
     dep1: getMeFoo('comp1'), 
     dep2: getMeFoo('comp2') 
    } 
});