Angular2 Http error

Question

I'm starting learning Angular2 by following the quickstart they provide in their page, and now I'm trying to make some Http requests. But whenever I bootstrap the component, Chrome keeps giving me this errors:

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

This is the component:

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

And the bootstrapping:

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

bootstrap(UsersComponent, [HTTP_PROVIDERS]);

The view is only {{people}}.

TypeScript is compiling OK. I don't even know what's failing!

See stackoverflow.com/a/34402203/4933038

Eric Martinez
– Eric Martinez

2015-12-25 22:23:12 +00:00
Commented Dec 25, 2015 at 22:23 — Eric Martinez
– Eric Martinez, Commented Dec 25, 2015 at 22:23

mgamsjager · Accepted Answer · 2015-12-28 14:30:26Z

26

The documentation is lacking on that part. Router and Http need to be added to the index.html. Easy mistake to make

answered Dec 28, 2015 at 14:30

mgamsjager

4244 silver badges11 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

colbyJax Over a year ago

quick note, the script tags are: <script src="node_modules/angular2/bundles/router.dev.js"></script> <script src="node_modules/angular2/bundles/http.dev.js"></script>

Eggy · Accepted Answer · 2015-12-26 00:14:43Z

7

First, if you injected provider on bootstrap, you don't have to do it again in component.

Second, did you included http.js in your index.html?

And third, you have an error in your code. There should be this.http.get() not http.get()

answered Dec 26, 2015 at 0:14

Eggy

4,1747 gold badges26 silver badges40 bronze badges

Comments

buczek · Accepted Answer · 2016-04-28 19:13:58Z

1

in bootstraping you do not have to import the HTTP_PROVIDERS dependencies. so try:-

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

bootstrap(UsersComponent, [HTTP_PROVIDERS]);

and in index file you need to add :-

<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>

for routing and http

edited Apr 28, 2016 at 19:13

buczek

2,0707 gold badges29 silver badges42 bronze badges

answered Apr 28, 2016 at 18:50

Manrah

5663 silver badges13 bronze badges

Collectives™ on Stack Overflow

Angular2 Http error

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related