0

我正在使用gulp运行和构建来运行我的应用程序。我正在使用文件中$http的服务获取文件内容index.js，然后设置变量的值，例如

window.variablex = "http://localhost:8080/appname".

这是我的做法（在index.js）

(function ()
 {
  'use strict';

   angular
    .module('main')
    .controller('IndexController', IndexController);
function IndexController($http){
   $http.get('conf/conf.json').success(function(data){

     window.variable = data.urlValue;

  }).error(function(error){
    console.log(error);
  });
    }
});

我创建了一个工厂来调用我的后端应用程序的其余 API，例如

(function(){

  'use strict';

   angular
   .module('main')
   .factory('testService',['$resource',testService]);
     function agentService($resource){
 var agents = $resource('../controller/',{id:'@id'},
  {

    getList:{
      method:'GET',
      url:window.variable+"/controller/index/",
      isArray:false
}
});

现在，我除了打了个休息电话

http://localhost:8080/appname/controller

但它总是发送一个http://undefined/appname/controller不正确的呼叫。

我可以在其他任何地方获得新的设置值，但是这个值并没有resource service以某种方式设置在对象中。我肯定错过了一些东西。

任何帮助将非常感激

4

2 回答 2

1

当你使用 Gulp 时，我建议你使用gulp-ng-config

例如，你有你的 config.json：

{
  "local": {
    "EnvironmentConfig": {
      "api": "http://localhost/"
    }
  },
  "production": {
    "EnvironmentConfig": {
      "api": "https://api.production.com/"
    }
  }
}

那么，gulpfile中的用法是：

gulp.task('config', function () {
    gulp.src('config.json')
        .pipe(gulpNgConfig('main.config', {
            environment: 'production'
        }))
        .pipe(gulp.dest('.'))
});

您将获得以下输出：

angular.module('myApp.config', [])
.constant('EnvironmentConfig', {"api": "https://api.production.com/"});

然后，您必须在 app.js 中添加该模块

angular.module('main', [ 'main.config' ]);

要使用该变量，您必须注入您的提供程序：

angular
    .module('main')
    .factory('testService', ['$resource', 'EnvironmentConfig', testService]);
function agentService($resource, EnvironmentConfig) {

    var agents = $resource('../controller/', {id: '@id'},
        {

            getList: {
                method: 'GET',
                url: EnvironmentConfig + "/controller/index/",
                isArray: false
            }
        });
}
于 2017-10-23T19:05:08.010 回答
0

@Kenji Mukai 的回答确实有效，但我可能不得不在运行时更改配置，但它失败了。这就是我实现它的方式（以防任何人在应用程序获得 boostrap 之前设置变量时遇到问题）

这些是我遵循的集合

  1. ng-app="appName"从您的文件中删除，html因为这是导致问题的原因。Angular 会先点击这个标签并引导您的应用程序。因此应用程序在从服务器端加载数据之前被引导（在我的情况下）

  2. 在我的主模块中添加了以下内容

    var injector = angular.injector(["ng"]);
var http = injector.get("$http");
   return http.get("conf/conf.json").then(function(response){
    window.appBaseUrl = response.data.gatewayUrl
      }).then(function bootstrapApplication() {
         angular.element(document).ready(function() {
         angular.bootstrap(document, ["yourModuleName"]);
        });
     });

这将在您每次刷新页面时加载/设置新值。您conf.json甚至可以在运行时更改文件，刷新页面将负责更新值。

于 2017-10-24T07:59:24.203 回答