Javascript 在应用程序配置angular.js中的自定义提供程序中使用$http

Javascript 在应用程序配置angular.js中的自定义提供程序中使用$http,javascript,angularjs,angular-services,Javascript,Angularjs,Angular Services,主要问题是,这可能吗?我试过了,但没有成功 main app.js ... var app = angular.module('myApp', ['services']); app.config(['customProvider', function (customProvider) { }]); ... 提供商本身 var services = angular.module('services', []); services.provider('custom', function ($ht

主要问题是,这可能吗?我试过了,但没有成功

main app.js

...
var app = angular.module('myApp', ['services']);
app.config(['customProvider', function (customProvider) {

}]);
...
提供商本身

var services = angular.module('services', []);
services.provider('custom', function ($http) {
});
我犯了这样的错误:

Uncaught Error: Unknown provider: $http from services 
有什么想法吗

谢谢

底线是:
  • 您不能将服务注入提供程序配置部分
  • 您可以在初始化提供者服务的部分中插入服务
细节: Angular framework有两个阶段的初始化过程:

第一阶段:配置 在
config
阶段,初始化所有提供程序,并执行所有
config
部分。
config
部分可能包含配置提供程序对象的代码,因此它们可以被注入提供程序对象。 但是,由于提供程序是服务对象的工厂,并且在此阶段提供程序未完全初始化/配置->因此,在此阶段,您不能要求提供程序为您创建服务->在配置阶段,您不能使用/注入服务。 此阶段完成后,所有提供程序都已准备就绪(配置阶段完成后,无法再进行提供程序配置)

第2阶段:运行 在
run
阶段,执行所有
run
部分。在这个阶段,提供者已经准备好,可以创建服务->在
运行
阶段,您可以使用/注入服务

示例: 1.将
$http
服务注入提供程序初始化功能将无法工作 由于我们试图将
$http
服务注入到在
config
阶段执行的函数中,我们将得到一个错误:

这个错误实际上是说,用于创建
$http
服务的
$httpProvider
尚未就绪(因为我们仍处于
config
阶段)

2.将
$http
服务注入服务初始化功能将起作用:
//好的
角度.module('myModule').provider('myProvider',function(){
//第1节:初始化/配置提供程序的代码(在'config'阶段执行)
...
这是。$get=function($http){
//此处是初始化/配置服务的代码(在“运行”阶段执行)
返回myService;
};
});

由于我们现在将服务注入到服务初始化函数中,该函数在
运行
阶段执行,因此此代码将正常工作。

这可能会给您带来一些优势:

var initInjector = angular.injector(['ng']);
var $http = initInjector.get('$http');

但是要小心,成功/错误回调可能会使您在应用程序启动和服务器响应之间处于竞争状态。

对于您的问题,“有什么想法吗?”,我会回答“是”。但是等等,还有更多

我建议只在配置中使用JQuery。例如:

var app = angular.module('myApp', ['services']);
app.config(['$anyProvider', function ($anyProvider) {
    $.ajax({
        url: 'www.something.com/api/lolol',
        success: function (result) {
            $anyProvider.doSomething(result);
        }
    });
}]);

这是一个老生常谈的问题,如果我们想依靠图书馆的核心能力,我们似乎有一些鸡蛋的事情在进行

我所做的不是从根本上解决问题,而是绕道而行。创建一个包裹整个身体的指令。前

<body ng-app="app">
  <div mc-body>
    Hello World
  </div>
</body>
Auth
是一种服务或提供者,例如

.provider('Auth', function() {
  ... keep your auth configurations
  return {
    $get: function($http) {
      return {
        login: function() {
          ... do something about the http
        }
      }
    }
  }
})
在我看来,我确实可以控制引导程序的顺序,这是在常规引导程序解析所有提供程序配置之后,然后尝试初始化
mc body
指令


在我看来,这个指令可能比路由提前,因为路由也是通过一个指令注入的,例如
。但在这一点上我可能错了。需要更多的调查。

posible-man,是的,这是真的,但我说的是
app.config
parti也知道这个限制,但认为在提供者内部它是可能的。答案很好,但它解释了在配置期间如何不可能注入服务,它没有解释如何在配置期间进行HTTP POST/GET。这对于使用API提供的值进行配置的应用程序来说很重要。@bebraw&Kosmetika-我认为在配置阶段您需要请求的唯一一件事是某种设置对象。可能它包含API端点、用户信息、用户的区域设置和语言设置等。如果是这样,我建议以某种方式将这些信息包含在javascript源代码中。您可以在index.html上使用服务器端呈现来放入一些设置,以便在应用程序初始化之前可以使用这些设置。其他的事情,我都会想办法解决-init@Sean:如何制作HTTP POST/GET是一个与OP不同的问题(是否可以在配置阶段使用$HTTP?),可能需要单独发布一篇文章;由于Angular配置阶段的同步性质,向配置代码提供服务器端数据的一个好方法是在服务器端呈现期间将其作为HTML页面中的javascript对象呈现(例如,
var config=;
)。这可以通过使用模板引擎来实现,比如Smarty for PHP、Jinja2 for Python、Nunchuck for NodeJS等等@threed:只有当客户端代码来自同一台服务器时,才可以将配置数据直接插入服务器上的HTML或js中。使用CORS,现在可以(而且非常理想)从不同的服务器提供客户机代码,从不同的服务器提供数据。在这些情况下,我们确实需要使用HTTP检索配置数据。虽然这是一个答案,但不是对所问问题的答案。对于我的提供程序,“接受的答案”失败。。。我花了两天的时间试图让这项工作毫无希望。你的方法很快就奏效了。你能澄清一下这里创建的实例是“真正的”服务单例,还是仅仅是Angular执行真正的注入器魔术时被丢弃的服务实例。Eric,我现在无法确认这一点。怎么
<body ng-app="app">
  <div mc-body>
    Hello World
  </div>
</body>
link: function(scope, element, attrs) {
  Auth.login().then() ...
}
.provider('Auth', function() {
  ... keep your auth configurations
  return {
    $get: function($http) {
      return {
        login: function() {
          ... do something about the http
        }
      }
    }
  }
})