2017-08-02 65 views
3

我有几个定义的模块。我不想将它们全部加载到我的应用程序中。相反,我想根据配置文件加载它们。例如如何根据angularJS中的配置文件加载模块

模块1:

angular.module('section1', []) 

单词数:

angular.module('section2', []) 

在每个模块的,它将有自己的HTML模板和业务逻辑。然后在app.module.js中:

angular.module('app', ['module1', 'module2']); 

模块1和模块2都将加载在一起。我不想硬编码,相反,我将有一个配置文件,是这样的:

[{'module1': true}, {'module2':false}] 

最终,每当应用程序启动的时候,我读的配置文件,然后决定哪些模块将被加载和哪些模块不会。在上面的例子中,模块1将被加载,而模块2则不会被加载。

我该怎么做?

回答

1

你可以manually bootstrap角js应用程序。它将帮助您添加条件并决定要加载哪个模块

以下是您如何以角度进行手动引导。

angular.element(function() { 
    if(/* condition */ { 
    angular.bootstrap(document, ['module1']); 
    } else { 
    angular.bootstrap(document, ['module2']); 
    } 
}); 
+0

您是否在实践中完成了这项工作?我非常有兴趣只加载适用于用户配置文件有权访问的角色的模块。从角度角度来看,还有什么更多? (当然,我可以根据如何根据配置文件生成模块阵列来填写详细信息)。有没有可以提供的小样本?将非常感激! – flyer

+1

https://docs.angularjs.org/guide/bootstrap - 你可以查看更多细节。 –

+0

谢谢。我检查了ng-app上的源代码并通过它进行了调试,这对我的用例来说非常基本。真的只是归结为这2条线,这是类似于你的(配置结束为{strictDi:true}) config.strictDi = getNgAttribute(appElement,'strict-di')!== null; bootstrap(appElement,模块?[module]:[],config); – flyer

1

您可以在定义角模块并将数组作为变量传递之前构建模块依赖项数组。如果你完全控制了配置文件以及它们是如何加载的,那么配置文件可能就是依赖关系的数组。像这样:

var config = ['module1', 'module2']; 
angular.module('app', config); 

这是假设你有多个配置文件,然后加载你想要的那个特定的上下文。因为它的配置的角度应用程序定义之前(因此自举)

var config = { 
    'profileA': [ 'module1' ], 
    'profileB': [ 'module2' ] 
}; 
var currentProfile = 'profileA'; 
angular.module('app', config[currentProfile]); 

,角止跌”:

如果你想在一个文件中的所有模块依赖的配置,你可以像这样格式化不关心你的模块依赖来自哪里。只要实际模块的.js文件已被加载。不过,如果浏览器未刷新,您将无法更改配置文件。