Angular2 +打字稿+ jspm:没有Http的提供者(App-> Provider-> Http) [英] Angular2 + typescript + jspm : No provider for Http ( App -> Provider -> Http )

问题描述

我尝试使用system.js从Webpack迁移到JSPM.我们有简单的App组件.我不喜欢这篇文章使用JSPM和SystemJS进行Angular 2入门安装程序和原子中的打字稿(第1部分)

I trying migrate from Webpack to JSPM with system.js. We have simple App component. I was fallowing this article Angular 2 Starter Setup with JSPM, SystemJS and Typescript in atom (Part 1)

import {Component} from 'angular2/core';
import {Bus} from './business.service';

@Component({
  selector: 'app',
  template: `
  <p>Hello World</p>
  `,
  providers:[Bus]
})
export class App {
  constructor(private bus : Bus) { }
}

和具有 Http

import {Injectable} from 'angular2/core';
import {Http, Response, Headers, RequestOptions} from 'angular2/http';
import {Observable}     from 'rxjs/Observable';

@Injectable()
 export class Bus {

  constructor(private http: Http){

  }
}

在Webpack中工作正常，但在使用systemjs时出现此错误

In Webpack works fine but here with systemjs I getting this error

例外:没有Http的提供者！(应用->总线-> Http)

EXCEPTION: No provider for Http! (App -> Bus -> Http)

我阅读了 Angular2没有NameService提供程序，但是他们谈论的是Angular2 alpha，而没有提供程序中的提供程序，我们使用beta @ 7

I read Angular2 no provider for NameService but they talking about Angular2 alpha and no provider in provider and we use beta@7

我也玩

import {Component} from 'angular2/core';
//import {Bus} from './business.service';
import {Http, Response, Headers, RequestOptions} from 'angular2/http';
@Component({
  selector: 'app',
  template: `
  <p>Hello World</p>
  `,
  providers:[Http]
})
export class App {
  constructor(private bus : Http) { }
}

但错误甚至更奇怪

例外:没有ConnectionBackend的提供者！(应用-> Http-> ConnectionBackend)

EXCEPTION: No provider for ConnectionBackend! (App -> Http -> ConnectionBackend)

我什至尝试更改为angular2-beta @ 6.还有angular2-beta @ 1你知道我做错了吗?谢谢

I even tryed change to angular2-beta@6. and also angular2-beta@1 Do you know what I do wrong? thank you

使用加载程序版本: systemjs@0.19.23

推荐答案

在引导应用程序时，您需要定义 HTTP_PROVIDERS 提供程序:

You need to define the HTTP_PROVIDERS providers when bootstrapping your application:

import {HTTP_PROVIDERS} from 'angular2/http';

bootstrap(AppComponent, [ HTTP_PROVIDERS ]);

，或者如果要在组件级别指定它:

or if you want to specify it at your component level:

import {Component} from 'angular2/core';
//import {Bus} from './business.service';
import {Http, Response, Headers, RequestOptions, HTTP_PROVIDERS} from 'angular2/http';
@Component({
  selector: 'app',
  template: `
    <p>Hello World</p>
  `,
  providers:[HTTP_PROVIDERS] // <-----------
})
export class App {
  constructor(private bus : Http) { }
}

这篇关于Angular2 +打字稿+ jspm:没有Http的提供者(App-> Provider-> Http)的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！