如何在Angular.js中配置不同的环境？

Question

如何管理不同环境的配置变量/常量？这可能是一个示例：我的其余API可以访问localhost:7080/myapi/，但是在Git版本控制下使用相同代码工作的朋友在Tomcat上部署了该API localhost:8099/hisapi/。假设我们有这样的东西：angular    .module('app', ['ngResource'])    .constant('API_END_POINT','<local_end_point>')    .factory('User', function($resource, API_END_POINT) {        return $resource(API_END_POINT + 'user');    });如何根据环境动态注入API端点的正确值？在PHP中，我通常使用config.username.xml文件来执行此类操作，将基本配置文件（config.xml）与用户名称识别的本地环境配置文件合并。但是我不知道如何在JavaScript中管理这种事情？

Answer 1

一个很酷的解决方案可能是将所有特定于环境的值分成一个单独的角度模块，所有其他模块都依赖于以下角度模块：

angular.module('configuration', [])

       .constant('API_END_POINT','123456')

       .constant('HOST','localhost');

然后，需要这些条目的模块可以声明对它的依赖关系：

angular.module('services',['configuration'])

       .factory('User',['$resource','API_END_POINT'],function($resource,API_END_POINT){

           return $resource(API_END_POINT + 'user');

       });

现在您可以考虑其他更酷的东西：

包含配置的模块可以分为configuration.js，它将包含在您的页面中。

只要您不将此单独文件检入git中，每个人都可以轻松地编辑此脚本。但是，如果不在单独的文件中，则不检入配置会更容易。另外，您可以在本地分支。

现在，如果您有一个像ANT或Maven这样的构建系统，那么您的进一步步骤可能是为值API_END_POINT实现一些占位符，这些占位符将在构建时被替换为您的特定值。

或者，您有您的configuration_a.jsand，configuration_b.js并在后端决定要包含的内容。