Angular 2 HTTP 请求 : TypeError: backend. createConnection 不是函数

Question

我试图在 Angular 中运行一个简单的 HTTP 请求，但遇到了以下错误:

angular2.dev.js:23941 Error: Uncaught (in promise): EXCEPTION: Error during instantiation of AlbumListComponent!. ORIGINAL EXCEPTION: TypeError: backend.createConnection is not a function

为了简化，我将 HTTP 功能分解为最简单的删除服务并直接访问 HTTP 服务和 Observable:

import {Component} from 'angular2/core';
import {Album} from './album';
import {AppState} from './appstate'; 
import {Observable}     from 'rxjs/Observable';

import {Http}    from 'angular2/http';

@Component({
    selector: 'album-list',
    templateUrl: 'Views/albumList.html',
    providers: [AlbumService, Http, Response]        
})
export class AlbumListComponent {
    albums: Array<Album> = [];
    title: string = "Album Listing";
    errorMessage: string;


    constructor(public state: AppState,
        public albumService: AlbumService,
        public http: Http) {

        console.log('AlbumList Constructor' +  this.title);
        state.activeTab = "albums";
        debugger;

        http.get(state.urls.albums)
            .map(res => {
                debugger;
                return res.json()
            })
            //.catch(error => {
            //    debugger;
            //    console.error(error);
            //    return Observable.throw(error.json().error || 'Server error');
            //})
            .subscribe(albums => this.albums = albums)           

        //this.getAlbums();  // service removed to simplify
    }


}

Bootstrap 代码(脚本列表中包含 http.dev.js):

import {bootstrap}    from 'angular2/platform/browser';
import {Albumviewer} from './albumviewer.component';
import {ROUTER_PROVIDERS} from 'angular2/router';
import {HTTP_PROVIDERS} from 'angular2/http';
import {AppState} from './appstate'
import 'rxjs/Rx';

bootstrap(Albumviewer,[
    ROUTER_PROVIDERS,
    HTTP_PROVIDERS,
]);

我要么收到描述的错误，要么收到有关缺少提供程序(如 ConnectionBackend)的错误。

如果我删除 Http 访问代码，应用程序运行正常。有了里面的代码，它就会爆炸。我不知道在此处查看什么 - 因为错误消息清楚地指向 HTTP 服务使用的子组件。

Answer 1

更新

在 Angular2 final 中添加 HttpModule 到 @NgModule() 的导入做同样的事情

原创

你没有显示你的 bootstrap(...) 但它可能不包含 HTTP_PROVIDERS

bootstrap(AppComponent, [HTTP_PROVIDERS]);

HTTP_PROVIDERS 包含 Http 及其所有依赖项。如果您将 HTTP_PROVIDERS 添加到 bootstrap() ，则无需将 Http 添加到组件上的提供程序，因为这样它就可以在全局范围内使用。

如果你想注入(inject)它，你仍然需要导入它。