Question

Angular版本：2.0.0-beta.13

我正在尝试将http注入服务：

@Injectable()
export class GithubService {
    ...
    constructor(private http: Http) {
    }
}

我已将HTTP_PROVIDERS列为我的应用程序的根组件中的提供程序，因此该提供程序应该可用于我的应用程序中的任何组件：

@Component({
  providers: [HTTP_PROVIDERS],
})
export class AppComponent {}

但是，当我运行此应用程序时，我收到以下错误：

EXCEPTION：错误：未捕获（承诺）：没有Http的提供者！（HttpReqComponent - ＆gt; GithubService - ＆gt; Http）

我做错了什么？

修改

我将providers更改为viewProviders，错误现已消失！

@Component({
  viewProviders: [HTTP_PROVIDERS],
})
export class AppComponent {}

但是，我无法解释为什么这有效。任何视图都不会直接访问http。它只能在GithubService内访问。那么为什么我必须将HTTP_PROVIDERS声明为viewProvider？

修改2

好吧，我将AppComponent的providers声明向下移动到我需要它的组件，现在它可以工作了！因此，在根级别声明它必定有一些怪癖。

@Component({
    providers: [HTTP_PROVIDERS, GithubService],
})
export class HttpReqComponent { }

实际上，providers和viewProviders都有效。事实证明viewProviders实际上更具限制性，并提供更好的组件封装。有关详细信息，请参阅this article。

Answer 1

点击此链接

Angular2/http Exception no ConnectionBackend 在使用Angular 2 Quickstart（https://angular.io/guide/quickstart）时，@ abreneliere的答案对我来说是正确的，我正在尝试向组件添加服务。

答案：文件：app.module.ts 代码：

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { HttpModule } from "@angular/http";
import { AppComponent } from './app.component';

@NgModule({
    imports: [BrowserModule, HttpModule],
    declarations: [AppComponent],
    bootstrap: [AppComponent]
})
export class AppModule { }

Answer 2

如果你选择Providers:[HTTP_PROVIDERS]，可以参考HTTP_PROVIDERS进入bootstrap()。您不需要使用viewProvider，它可用于其他目的。

您必须确保已包含http.dev.js（通过CDN / node_modules）。

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/2.0.0-beta.13/http.dev.js"></script>

然后在 rootComponent ，

import {HTTP_PROVIDERS} from 'angular2/http';
import {GithubService} from './GithubService';

bootstrap(rootComponent,[HTTP_PROVIDERS,GithubService]);

// if you reference HTTP_PROVIDERS here globally (in bootstrap), you don't require to use providers:[HTTP_PROVIDERS] in any component. 
// same way GithubService reference has been passed globally which would create single instance of GithubService (In case if you want)

然后在 GithubService ，

import {Http} from 'angular2/http';

@Injectable()
export class GithubService {
    ...
    constructor(private http: Http) {  // this will work now without any error
    }
}

Answer 3

截至2.0.0-rc.5，现在是：

import { HttpModule } from '@angular/http';


@NgModule({
  imports: [
    HttpModule
  ]}

https://angular.io/docs/ts/latest/guide/server-communication.html

Answer 4

您可以将{ HttpModule }导入到已声明组件的模块中，在该模块中您使用可注入服务，给定模块不是延迟加载的。

在服务中注入http会给出“没有Http的提供者！”错误

4 个答案: