I'm working on an app in angular 2/ nodejs and I'm trying to bootstrap the application. I've defined the root component in app.component.ts:
import {Component} from 'angular2/core';
@Component({
selector: 'pm-app',
template:`<div><h1>{{pageTitle}}</h1>
<div>My First Component</div>
<div>`
})
export /**
* name
*/
class AppComponent {
//constructor(parameters) {}
pageTitle: string = "Acme Product Managment";
}
and when the app loads, the page title should be injected into the index.html page in the <pm-app> tag:
(index.html)
<html>
<head>
<title>Angular 2 QuickStart</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href= "node_modules/bootstrap/dist/css/bootstrap.css" rel= "stylesheet" />
<link rel="app/app.component.css" href="styles.css">
<!-- 1. Load libraries -->
<script src="node_modules/angular2/es6/dev/src/testing/shims_for_IE.js"></script>
<script src="node_modules/es6-shim/es6-shim.min.js"></script>
<script src="node_modules/systemjs/dist/system-polyfills.js"></script>
<!-- Polyfill(s) for older browsers -->
<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>
<!-- 2. Configure SystemJS -->
<script src="systemjs.config.js"></script>
<script>
System.config({
packages:{
app:{
format: 'register',
defaultExtension: 'js'
}
}
});
System.import('app/main').then(null, console.error.bind(console));
</script>
</head>
<!-- 3. Display the application -->
<body>
<pm-app>Loading App</pm-app>
</body>
</html>
For some reason, when the page renders, only the "Loading App" text shows which I think indicates that the bootstrapping process wasn't successful. When I open the dev console, I get the following errors:
shims_for_IE.js:2 Uncaught SyntaxError: Unexpected token <
es6-shim.min.js:2 Uncaught SyntaxError: Unexpected token <
system-polyfills.js:2 Uncaught SyntaxError: Unexpected token <
angular2-polyfills.js:2 Uncaught SyntaxError: Unexpected token <
system.src.js:2 Uncaught SyntaxError: Unexpected token <
Rx.js:2 Uncaught SyntaxError: Unexpected token <
angular2.dev.js:2 Uncaught SyntaxError: Unexpected token <
systemjs.config.js:2 Uncaught SyntaxError: Unexpected token <
localhost/:23 Uncaught ReferenceError: System is not defined
All of these packages should be installed so what could be the problem?
