找不到AngularJS配置模块

时间:2015-01-06 16:51:18

标签: javascript angularjs

我对AngularJS框架相当新,但基本上我要做的是将CSRF令牌注入我的应用程序,但我想根据配置更改URL。以下是我到目前为止的情况:

var VERISION_API = 'v1';
var config_data = {
    'CFG': {
        'EP': 'https://mydomain.com/api/' + VERISION_API + '/web/'
    }
};
var configMod = angular.module("cfg",[]);
angular.forEach(config_data,function(key,value) {
  configMod.constant(value,key);
});

var myApp = angular.module("app", ["cfg", "ngResource", "ngRoute"]);

(function () {
    var $injector = angular.injector(['ng']);
    $injector.invoke(['cfg', '$http', '$rootScope', function (cfg, $http, $rootScope) {
        $rootScope.$apply(function (CFG) {
            $http.get(CFG.EP + "accounts/csrf").then(function (response) {
                myApp.constant("CSRF_TOKEN", response.csrf_token);
                angular.bootstrap(document, ['app']);
            });
        });
    }]);
})();

我一直收到以下错误:

未捕获错误:[$ injector:unpr]未知提供商:cfgProvider< - cfg

我知道这与我运行$ injector.invoke的方式有关,但我已经尝试了一切。希望有人可以帮助我,告诉我我做错了什么?

2 个答案:

答案 0 :(得分:2)

一些问题,见内联: -

  var $injector = angular.injector(['ng', 'cfg']); //<-- Add module name here
   /*Injection is case sensitive it mustbe CFG*/
    $injector.invoke(['CFG', '$http', '$rootScope', function (cfg, $http, $rootScope) {
        $rootScope.$apply(function () { //Do not set an argument here
            $http.get(cfg.EP + "accounts/csrf").then(function (response) {
                myApp.constant("CSRF_TOKEN", response.csrf_token);
                angular.bootstrap(document, ['app']);
            });
        });
    }]);

1)您需要使用具有依赖关系的模块获取注入器,例如:

 var $injector = angular.injector(['ng', 'cfg']);

2)DI服务/提供商/等..名称区分大小写:

  $injector.invoke(['CFG',...

3)不要在$rootScope.$apply的匿名函数中传递参数,它将在该范围内创建一个局部变量。所以只是:

  $rootScope.$apply(function () {

注入依赖项可从上部范围作为变量(参数cfg)使用,因此只需将其访问为:

   $http.get(cfg.EP + "accounts/csrf");

在演示中检查网络控制台:

&#13;
&#13;
var configMod = angular.module("cfg", []);
var config_data = {
  'CFG': {
    'EP': 'https://mydomain.com/api//web/'
  }
};
var configMod = angular.module("cfg", []);
angular.forEach(config_data, function(key, value) {
  configMod.constant(value, key);
});
var myApp = angular.module("app", ["cfg", "ngResource", "ngRoute"]);

(function() {
  var $injector = angular.injector(['ng', 'cfg']); //<-- Add module name here
  /*Injection is case sensitive it mustbe CFG*/
  $injector.invoke(['CFG', '$http', '$rootScope',
    function(cfg, $http, $rootScope) {
      $rootScope.$apply(function() { //Do not set an argument here
        $http.get(cfg.EP + "accounts/csrf").then(function(response) {
          myApp.constant("CSRF_TOKEN", response.csrf_token);
          angular.bootstrap(document, ['app']);
        });
      });
    }
  ]);
})();
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
&#13;
&#13;
&#13;

答案 1 :(得分:0)

angular从providerCache获取服务的字符串键区分大小写,因此应使用CFG