2015-12-25 1 views
14

Sto iniziando a imparare Angular2 seguendo lo quickstart che forniscono nella loro pagina, e ora sto cercando di fare un po 'di Http requests. Ma ogni volta che bootstrap del componente, Chrome continua a mi dà questo errore:Angular2 Http error

Uncaught SyntaxError: Unexpected token <   http:1 
Uncaught SyntaxError: Unexpected token <   angular2-polyfills.js:138 
    Evaluating http://localhost:3000/angular2/http 
    Error loading http://localhost:3000/app/boot.js 

Questo è il componente:

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

@Component({ 
    selector: 'users', 
    providers: [HTTP_PROVIDERS], 
    templateUrl: 'app/views/users.html' 
}) 
export class UsersComponent { 

    people: Object[]; 
    constructor(http: Http) { 
    http.get('http://192.168.56.101/api/test').subscribe(res => { 
     this.people = res.json(); 
     console.log(this.people); 
    }); 
    } 
} 

E il bootstrapping:

import {bootstrap} from 'angular2/platform/browser' 
import {UsersComponent} from './components/users' 

bootstrap(UsersComponent, [HTTP_PROVIDERS]); 

La vista è unica {{people}}.

TypeScript sta compilando OK. Non so nemmeno cosa sta fallendo!

+2

Vedi http://stackoverflow.com/a/34402203/4933038 –

risposta

26

La documentazione è carente su quella parte. Router e Http devono essere aggiunti all'indice.html. Errore facile da effettuare

+0

ha funzionato per me !! – noor

+0

per favore qualche codice .. – albanx

+1

quick note, i tag script sono: colbyJax

7

Innanzitutto, se il fornitore è stato iniettato su bootstrap, non è necessario ripetere l'operazione nel componente.

In secondo luogo, hai incluso http.js nel tuo index.html?

E in terzo luogo, si è verificato un errore nel codice. Ci dovrebbe essere this.http.get() non http.get()

1

nel bootstraping non è necessario importare le dipendenze di HTTP_PROVIDERS. in modo da provare: -

import {HTTP_PROVIDERS} from 'angular2/http'; 
import {bootstrap} from 'angular2/platform/browser' 
import {UsersComponent} from './components/users' 

bootstrap(UsersComponent, [HTTP_PROVIDERS]); 

e nel file di indice è necessario aggiungere: -

<script src="node_modules/angular2/bundles/router.dev.js"></script> 
<script src="https://code.angularjs.org/2.0.0-beta.11/http.dev.js"></script> 

per il routing e http

+0

bello e aggiornato. –