Angular 2 RC HTTP_PROVIDERS error

Question

I have changed my angular 2 app to RC. It worked fine until i included HTTP_PROVIDER and created service.ts.

I get an error

(index):14 Error: SyntaxError: Unexpected token <(…)

and i cant seem to discover why. Can anyone help with this ?

This is my service.ts code

    /**
 * Created by Adjoa on 5/29/2016.
 */
import {Injectable} from  "@angular/core";
import {Http,Headers,HTTP_PROVIDERS} from "@angular/http";
import { Headers, RequestOptions } from '@angular/http';

@Injectable()

export class SignInService {
    constructor(private _http: Http){}

    postData(data:any){
        const body = JSON.stringify(data);
        const headers= new Headers();
        headers.append('Content-Type','application/json');
        return this._http.post('https://testing-angular-2.firebaseio.com/datatest.json', body, {headers:headers});
    }
}

I don't see where you used `HTTP_PROVIDERS`. And, it might be a typo in your question, but it should be `HTTP_PROVIDERS` with S at the end. — Abdulrahman Alsoghayer, Jun 08 '16 at 18:33
see here may help you http://stackoverflow.com/a/34758630/5043867 — Pardeep Jain, Jun 08 '16 at 18:34
@Abdulrahman, you are right but it still gives the same error. — Adjoa Wadee, Jun 08 '16 at 18:45
@PardeepJain, I saw that solution before, the problem with it is, its the beta version of angular 2 — Adjoa Wadee, Jun 08 '16 at 18:45
@A.Wad Please add your SystemJS configurations or whatever loader you used to load the `http` package. — Abdulrahman Alsoghayer, Jun 08 '16 at 19:19

score 3 · Accepted Answer · answered Jun 08 '16 at 19:39

Most of the time you have this error when SystemJS can't load a module. A 404 error is behind this message.

I think that you forgot to add the @angular/http entry into your SystemJS configuration:

var map = {
  'app': 'app', // 'dist',
  'rxjs': 'node_modules/rxjs',
  '@angular': 'node_modules/@angular'
};

var packages = {
  'app': { main: 'main.js',  defaultExtension: 'js' },
  'rxjs': { defaultExtension: 'js' }
};

var packageNames = [
  '@angular/common',
  '@angular/compiler',
  '@angular/core',
  '@angular/http', // <------
  '@angular/platform-browser',
  '@angular/platform-browser-dynamic',
  '@angular/router',
  '@angular/router-deprecated',
  '@angular/testing',
  '@angular/upgrade',
];

packageNames.forEach(function(pkgName) {
  packages[pkgName] = { main: 'index.js', defaultExtension: 'js' };
});

var config = {
  map: map,
  packages: packages
}

Angular 2 RC HTTP_PROVIDERS error

1 Answers1