Comment convertir l'alpha 2 angulaire en bêta angulaire

Question

Ce Plunker est écrit en alpha.45.

J'ai déjà écrit un succès plunker en bêta angulaire. J'essaie de combiner les deux exemples de code. En général, je pense que ce serait assez simple en changeant

<script src="https://code.angularjs.org/2.0.0-alpha.45/angular2.min.js"></script> 

à

<script src="https://code.angularjs.org/2.0.0-beta.0/angular2.min.js"></script> 

Il y aurait peut-être d'autres changements, mais il semble y avoir un sérieux problème avec HTTP BINDINGS.

Sur mon locale je reçois

Error: HTTP_BINDINGS is not defined Error loading

The angular.io documentation, là par exemple des références en direct alpha.37. Je ne peux pas sembler obtenir ces liaisons Http à charger correctement.

Après quelques recherches google exhaustives, je n'arrive pas à trouver une réponse.

Mise à jour:

Je me suis arrêté à l'aide Plunker et a tenté de suivre les commentaires Eric.

Voici mes app.component.ts

import {Component} from 'angular2/core'; 
import {bootstrap} from 'angular2/platform/browser'; 
import {NgFor} from 'angular2/common'; 
import {HTTP_PROVIDERS, Http} from 'angular2/http'; 

import {PeopleService} from './peopleService' 
import {Person} from './person' 

@Component({ 
    selector: 'my-app', 
    providers: [PeopleService,HTTP_PROVIDERS] 

}) 
@View({ 
    template: ` 
    <div> 
     <h2>Hello Angular2!</h2> 
     <my-person 
     *ngFor="#person of people" 
     [name]="person.name" 
     (hello)="saidHello($event)"> 
     </my-person> 
    </div> 
    `, 
    directives: [CORE_DIRECTIVES, Person] 
}) 
export class AppComponent { 
    constructor(public peopleService:PeopleService) { 
    peopleService.people 
     .subscribe(people => this.people = people); 
    } 
    saidHello($event){ 
    alert(`You said hello to ${$event}`) 
    } 
} 

et voici mon boot.ts

import {bootstrap} from 'angular2/platform/browser' 
import {AppComponent} from './app.component' 

bootstrap(AppComponent) 
    .catch(err => console.error(err)); 

et peopleService.ts

//a simple service 
import {Injectable} from 'angular2/core'; 
import {HTTP_PROVIDERS, Http} from 'angular2/http'; 

@Injectable() 
export class PeopleService { 
    constructor(http:Http) { 
    this.people = http.get('src/people.json').map(res => res.json()); 
    } 
} 

Ce sont les erreurs que je » m obtenir dans la console:

"NetworkError: 404 Not Found - http://127.0.0.1/angular2/http "

et

Error: XHR error (404 Not Found) loading http://127.0.0.1/angular2/http Error loading http://127.0.0.1/angular2/http as "angular2/http" from http://127.0.0.1/app/app.component.js

Answer 1

réponse @eric utile, je juste besoin de plus de détails. J'ai construit un plunker pour ce problème. La clé emporter tout ce que je voulais faire faire une requête http simple pour obtenir des données JSON à partir d'un fichier.

Heureusement, un exemple de travail complet aidera quelqu'un.

import {HTTP_PROVIDERS, Http} from 'angular2/http';