我有一个模块化的应用程序,它有多个供应商插件,我需要在每个视图中只加载必要的。
这是我的路线:
(function() {
'use strict';
angular.module('app.empresas').config(config);
function config($stateProvider, $ocLazyLoadProvider) {
$stateProvider
.state('app.empresas', {
url: '/empresas?Filter',
views: {
'main@': {
template: require('./empresas/empresas.html'),
controller: "AppController as App"
}
},
Params: {
title: 'Empresas',
bodyClass: '',
requiredLogin: true
}
})
.state('app.empresas.view', {
url: '/empresas/:ItemId',
views: {
'main@': {
template: require('./empresas.view/empresas.view.html'),
controller: "AppController as App"
}
},
Params: {
title: 'Empresa',
bodyClass: '',
requiredLogin: true
}
})
}
})();
我知道如何在没有webpack的情况下包含oclazyload资源,但现在我需要为每个视图包含特定的资源。 ¿怎么办?
答案 0 :(得分:0)
我使用此片段解决了它:
这是一个州的样本
.state('app.empresas.view', {
url: '/empresas/:ItemId',
views: {
'main@': {
templateUrl: '/app/main/apps/empresas/empresas.view/empresas.view.html',
controller: "AppController as App"
}
},
Params: {
title: 'Empresa',
bodyClass: '',
requiredLogin: true
},
resolve: ['$q', '$ocLazyLoad', function ($q, $ocLazyLoad) {
var deferred = $q.defer();
var mod = importAll(require.context('./empresas.view/', true, /\.*$/));
$ocLazyLoad.load({
name: 'app.empresas.view'
});
deferred.resolve(mod);
return deferred.promise;
}]
})
我使用此函数,要求使用oclazyload加载整个文件夹,并使用webpack在捆绑的单独文件中编译:
function importAll (r) {r.keys().forEach(r);}
我可以在一个视图中加载css,html,js文件而不需要逐个文件