Angular 2 System is not defined.

Angular 2 System is not defined.


You can Try to include the System JS file in your HTML header file and resolve this error.

Include SystemJS Script.

<script src="https://jspm.io/[email protected]"></script>

The Example for detail as given below.

index.html file

<!DOCTYPE html>
<html>

<head>
    <link rel="stylesheet" href="style.css" />
    <script src="https://jspm.io/[email protected]"></script>
    <script src="https://code.angularjs.org/2.0.0-alpha.36/angular2.min.js"></script>
    <script>
      System.config({
        paths: {
          'main.js':'main.js'
        }
      });

      System.import('main.js');
    </script>
</head>

<body>
    <app></app>
</body>

</html>


main.js file

import {Component, View, bootstrap} from 'angular2/angular2';

@Component({
  selector: 'app',
  bindings: [Service]
})
@View({
  template: '{{greeting}} I am Anil!'
})
class App {
  constructor(service: Service) {
    this.greeting = service.greeting();
    setTimeout(() => this.greeting = 'Hi,', 2000);
  }
}

class Service {
  greeting() {
    return 'Welcome you!';
  }
}

bootstrap(App);


The live demo example


ANIL SINGH

Anil Singh is an author, tech blogger, and software programmer. Book writing, tech blogging is something do extra and Anil love doing it. For more detail, kindly refer to this link..
My Blogs - https://code-sample.com and https://code-sample.xyz
My Book1 - BEST SELLING ANGULAR BOOK (INCLUDING ALL VERSIONS 2, 4, 5, 6, 7)
My Book2 - ANGULAR 2 INTERVIEW QUESTIONS BOOK - Both Books are Available on WorldWide.

www.code-sample.com/. Powered by Blogger.