我在哪里将配置放在 angularjs 应用程序中？答案

【问题标题】：where do I put configs in a angularjs app?我在哪里将配置放在 angularjs 应用程序中？
【发布时间】：2014-11-13 17:14:18
【问题描述】：

在我的 Angular 应用程序中，我有一个用于检索一些数据的 URL，即启用了 CORS 的服务器。

现在，到目前为止，我已将其硬编码在我的 javascript 文件中：

server_url = "http://localhost:7888/api.php/json?id=2"

现在，在测试和生产中，这些 URL 当然是无效的......每次我执行 git pull 时，它都会覆盖我的自定义设置。

我会在 Angular 应用程序中优雅地放置这样的配置吗？

【问题讨论】：

你在后端使用什么？
我认为这可以通过中间件和前端的混合来完成，看看 meanjs.org 方法，meanjs.org/generator.html#overview
您可能希望了解使用 Grunt 之类的工具根据环境将 URL 添加到您的 JS。
@jack.the.ripper 这是一个普通的 php/apache2 网络应用程序
你能在你的索引文件上做一个简单的 php 打印吗？

标签： angularjs git configuration hardcoded

【解决方案1】：

将其声明为常量。假设您有一个名为 App 的应用程序：

angular.module('App', []).constant("urls", {"server_url":"http://localhost:7888/api.php/json?id=2"});

一旦声明为常量，您就可以将其作为依赖项注入，就像注入服务一样。

【讨论】：

如何根据目标环境覆盖它？
不要注入它并声明一个新值。
你可以注入 url 并没有什么坏处，但是这个 url 最终会根据目标环境而改变，你仍然可以注入它但使用不同的值
@TheHeadRush 你的意思是为每个环境声明多个常量？
有点。您可以在同一个常量对象中声明多个值。例如，如果你有多个端点，你可以这样做：angular.module('App', []).constant("urls",{"server_url":"http://localhost:7888/","endpoint1":"api.php/json?id=1","endpoint2":"api.php/json?id=2"});

【解决方案2】：

好吧，基本上我会在这里采用 mean.js 方法，它很容易实现，它可能对你或其他任何人都有用。

你必须从你的中间件以角度写入你的主 HTML 文件（例如：index.html），在你的情况下，你的端点的 URL 必须根据你的环境而改变，只是为了保持简单假设我们有 dev (localhost) 和生产 (mydomain.com)

在你的 index html 中做一个简单的写：

 <script type="text/javascript">
        <?php 
         if(strpos( $_SERVER['HTTP_HOST'], 'mydomain.com') !== false){
             print "var endpoint = '"+ $server_url+ "';" 
         } else{
            print "var endpoint = '"+ $local_url+ "';" 
         }

         ?>
    </script>

你把它放到你的主 index.html 中，它可以通过使用 window 对象以角度形式使用，因此你可以将它包装成一个常量或 service。

这是一个常量的例子：

angular.module('app').run(function () {

}).value('endpoint', window.endpoint);

我不是很熟练的PHP，但我希望你能明白我的意思

【讨论】：