如何在angularJS中基于配置文件加载模块答案

【问题标题】：How to load module based on a configuration file in angularJS如何在angularJS中基于配置文件加载模块
【发布时间】：2017-08-02 20:00:26
【问题描述】：

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

模块1：

angular.module('section1', [])

模块2：

angular.module('section2', [])

在每个模块中，都会有自己的 HTML 模板和业务逻辑。然后在 app.module.js 中：

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

module1 和 module2 将一起加载。我不想硬编码，相反，我会有一个配置文件，比如：

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

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

我该怎么做？

【问题讨论】：

标签： javascript angularjs

【解决方案1】：

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

以下是您在 Angular 中进行手动引导的方法。

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

【讨论】：

你在实践中做过吗？我对仅加载适用于用户配置文件有权访问的角色的模块非常感兴趣。从 Angular 的角度来看，还有什么其他的吗？（当然，我可以根据配置文件生成模块数组的详细信息）。你能提供一个小样本吗？将不胜感激！
docs.angularjs.org/guide/bootstrap - 您可以查看此内容了解更多详情。
谢谢。我在 ng-app 上查看了源代码并通过它进行了调试，这对于我的用例来说非常基本。真的只是归结为与您的相似的这两行（配置最终为 { strictDi: true}） config.strictDi = getNgAttribute(appElement, 'strict-di') !== null; bootstrap(appElement, module ? [module] : [], config);
如果您的配置与 Angular 一起加载，在这种情况下，真的不需要手动引导 Angular。
@NikolajDamLarsen ：您所做的陈述不正确。尽管对于大多数应用程序，您不需要手动引导 Angular，但在某些情况下您可能需要手动引导。假设您希望仅在满足特定条件或发生其他一些活动后启动 Angular 应用程序。手动引导为您提供更多控制权，因此我建议您务必检查一下。不要仅仅因为你认为它没有效率而劝阻某人不学习新方法。

【解决方案2】：

您可以在定义角度模块之前构建模块依赖数组并将数组作为变量传递。如果您可以完全控制配置文件以及它们的加载方式，那么配置文件可能只是依赖项数组。像这样：

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

这是假设您有多个配置文件，然后为该特定上下文加载您想要的一个。

如果你想将所有模块依赖配置放在一个文件中，你可以这样格式化：

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

由于它是在定义 Angular 应用程序之前配置的（因此被引导），Angular 不会关心你的模块依赖项来自哪里。只要实际模块的 .js 文件已加载。但是，如果不刷新浏览器，您将无法更改个人资料。

【讨论】：