Question

编辑：此问题已弃用。请改为How to set a variable from an $http call then use it in the rest of the application WITHOUT making the whole application asynchronous。

在我的常量中，我需要从本地文件中读取。我所看到的方式是$http.get('localfile.ext').then ...

它告诉我$http未定义。 documentation表示常量是特殊的，服务以常量形式提供。

angular.module('myApp').constant(
  'test',
  ['xml','$http',
  (function ($http, x2js) {
    $http.get('web.config').then(function (response) {
      var appSettings = [];
      /*setting up the response*/
      var json = x2js.xml_str2json(response.data);
      var url = '' /* get url from json */;
    });
    // Use the variable in your constants
    return {
      URL: url
    }
  })()]);

修改

好的this documentation说你不能在常数中使用DI。但我需要使用$ http来获取值并使用它来设置常量。那么我怎么能做到这一点，或者什么是允许我在应用程序中的任何地方读取值的替代方案？

Answer 1

建立一个常量

使用构建系统将配置构建到Angular constant。有grunt-ng-constant和gulp-ng-constant。

解决依赖

使用ng-route或ui-router resolve解析所有路由的配置依赖性。

延迟引导

推迟引导过程以在应用程序位于angular-deferred-bootstrap之前解决全局依赖关系。

使用同步请求

同步请求阻塞，坏，阻塞......它们也很糟糕。可以使用原始XMLHttpRequest或jQuery.ajax（$http不支持同步请求。）

app.config(function ($provide) {
  var config;

  var xhr = new XMLHttpRequest();
  xhr.open('GET', 'configfile', false);
  xhr.send();
  if (xhr.status == '200') {
    config = xhr.responseText;
  }

  $provide.constant('config', config);
});

Answer 2

我通常做的是为服务器上的常量生成代码。而不是通过一些回调服务器来填充常量。

using Newtonsoft.Json.Linq;

public class JavascriptConstantsHelper
{
    public static string GetConstantsJavascriptFile()
    {
        var constantsCollectionModel = new JObject();

        constantsCollectionModel.Add("version", CoreAssembly.Version.ToString());


        const string outputTemplate = @"
            (function() {
                'use strict';

                window.myModule.constant('constantsCollection', function() {
                    return {constantsCollection};
                });
            })();";

        return outputTemplate.Replace("{constantsCollection}", constantsCollectionModel.ToString());
    } 
}

控制器可能看起来像这样

public class JavascriptController : Controller
{
    public ActionResult GetConstants()
    {
        return Content(JavascriptConstantsHelper.GetConstantsJavascriptFile(), "application/javascript");
    }
}

脚本标签看起来像这样

<script src="/Javascript/GetConstants"></script>

Answer 3

为了后人，这是我首先尝试的，使用Russo的答案作为指导。

但是，它为构建添加了172个文件和19 MB，所以我决定了另一个答案。如果我要在应用程序中添加广泛的asp.net服务器端功能，那就不会那么糟糕了。但是，逐渐地，对于一个设置，它是过度的。

<强>的web.config

  <appSettings>
    <add key="RestApiUrl" value="http://localhost/MyWebApiServer/api/"/>
  </appSettings>

<强>的index.html

<script src="api/settings"></script>

<强>控制器/ SettingsController.cs

using Microsoft.AspNet.Mvc;
using System.Configuration;
using Newtonsoft.Json.Linq;

namespace MyWebSite
{
  [Route("api/[controller]")]
  public class SettingsController : Controller
  {
    // GET: api/settings
    [HttpGet]
    public ActionResult Get()
    {
      var jObject = new JObject();
      foreach (string key in ConfigurationManager.AppSettings)
        jObject.Add(key, ConfigurationManager.AppSettings[key]);
      return Content(
        string.Format(@"'use strict'; angular.module('myApp').constant('appSettings', {0});", 
                      jObject), 
        "application/javascript");
    }
  }
}

api.js （这是我现有的api常量常量。现在是工厂了）

'use strict';

angular.module('myApp').factory('api', 
  ["appSettings",
    function (appSettings) {
      return {
        URL: appSettings.RestApiUrl,
        /* other settings */
      }
    }
  ]
);

如何使用$ http进入常量

3 个答案: