Angular2 + typescript + jspm: Нет провайдера для Http (App -> Provider -> Http)

Question

Я пытаюсь перейти с Webpack на JSPM с помощью system.js. У нас есть простой компонент приложения. Я не парование этой статьи 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 я получаю эту ошибку

ИСКЛЮЧЕНИЯ: Нет поставщика для Http! (App -> Bus -> Http)

Я прочитал Angular2 no provider for NameService, но они говорят о Angular2 альфа и не поставщик в провайдера, и мы используем бета @ 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) { } 
} 

но ошибка еще более странная

ИСКЛЮЧЕНИЕ: Нет провайдера для подключения к сети! (App -> Http -> ConnectionBackend)

Я даже попытался перейти на угловой2-бета @ 6. а также angular2-beta @ 1 Знаете ли вы, что я делаю неправильно? спасибо

Использование версии загрузчика: systemjs@0.19.23

Answer 1

Вы должны определить HTTP_PROVIDERS поставщиков при самонастройки приложения:

import {HTTP_PROVIDERS} from 'angular2/http'; 

bootstrap(AppComponent, [ HTTP_PROVIDERS ]); 

или если вы хотите укажите его на уровне вашего компонента:

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) { } 
} 

Answer 2

> = RC.5

Добавить HttpModule завезенного AppModule:

@NgModule({ 
    imports: [HttpModule], 
    ... 
}) 
export class AppModule {} 

< = RC.5

Вы должны добавить HTTP_PROVIDERS в список поставщиков в загрузчике

import {HTTP_PROVIDERS} from 'angular2/http'; 
<!-- --> 
bootstrap(AppComponent, [HTTP_PROVIDERS]); 

Смотрите также https://angular.io/docs/ts/latest/api/http/HTTP_PROVIDERS-let.html