I'm just starting to hack Angular 2, and now I'm trying to develop my first "real world" application. It is designed to extract data from restfull webservice, so I wrote this code:
boot.ts:
import {bootstrap} from 'angular2/platform/browser'
import {AppComponent} from './component/app.component'
import {Http, Headers} from 'angular2/http';
bootstrap(AppComponent);
app.component.ts:
import {Component} from 'angular2/core';
import {AuthComponent} from './auth.component';
@Component({
selector: 'my-app',
templateUrl: 'app/template/my-app.html',
styleUrls: ['app/style/my-app.css'],
directives: [AuthComponent]
})
export class AppComponent {
}
auth.service.ts:
import {Injectable} from 'angular2/core';
import {Http, Headers, HTTP_PROVIDERS} from 'angular2/http';
import {toPromise} from 'rxjs/operator/toPromise';
import {Credentials} from '../model/credentials';
@Injectable()
export class AuthService {
headers : Headers;
http: Http;
constructor(headers: Headers, http: Http){
console.log('CHAMOU CONSTRUTOR SERVICE');
this.headers = headers;
this.http = http;
this.headers.append('Content-Type', 'application/json');
}
}
index.html
<html>
<head>
<title>MegaSíndico</title>
<link href="http://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<script type="text/javascript" src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.5/js/materialize.min.js"></script>
<script src="node_modules/angular2/bundles/angular2-polyfills.js"></script>
<script src="node_modules/systemjs/dist/system.src.js"></script>
<script src="node_modules/rxjs/bundles/Rx.js"></script>
<script src="node_modules/angular2/bundles/angular2.dev.js"></script>
<script>
System.config({
packages: {
app: {
format: 'register',
defaultExtension: 'js'
}
}
});
System.import('app/boot')
.then(null, console.error.bind(console));
</script>
</head>
<body>
<my-app>Loading...</my-app>
</body>
</html>
I get this weird syntax error on my console:
Uncaught SyntaxError: Unexpected token <
Evaluating http:
Error loading http:
This is really strange because when I remove the service level constructor, it works and my html is displayed in the browser.
source
share