pankajparkar

(function (global) {
  System.config({
    paths: {
      // paths serve as alias
      'npm:': '/node_modules/'
    },
    // map tells the System loader where to look for things
    map: {
      // our app is within the app folder
      'app': '/app',

pankajparkar

{
    "name": "amin",
    "description": "Amin Test",
    "scripts": {
        "start": "lite-server"
    },
    "dependencies": {
        "@angular/common": "~4.1.0",
        "@angular/compiler": "~4.1.0",
        "@angular/core": "~4.1.0",

pankajparkar

<link rel="stylesheet" type="text/css" href="/node_modules/bootstrap/dist/css/bootstrap.min.css"/>
<script src="/node_modules/core-js/client/shim.min.js"></script>
<script src="/node_modules/zone.js/dist/zone.min.js"></script>
<!--<script src="node_modules/reflect-metadata/Reflect.js"></script>-->
<script src="/node_modules/systemjs/dist/system.js"></script>
<script src="/systemjs.config.js"></script>

pankajparkar

[
    {"Id": 1, "AssignedTo": "Alex", "Title": "Add feature to file upload", "Description": "Add feature to file upload", "Type": "Feature", "Priority": 9, "TicketNumber": "PM-1", "Status": 3},
    {"Id": 2, "AssignedTo": "Alex", "Title": "Create mockups for file upload UI", "Description": "Create mockups for file upload UI", "Type": "Feature", "Priority": 9, "TicketNumber": "PM-2", "Status": 3},
    {"Id": 3, "AssignedTo": "Alex", "Title": "Implement backend API for file upload", "Description": "Implement backend API for file upload", "Type": "Feature", "Priority": 9, "TicketNumber": "PM-3", "Status": 2},
    {"Id": 4, "AssignedTo": "Alex", "Title": "Create a front-end for file upload", "Description": "Create a front-end for file upload", "Type": "Feature", "Priority": 9, "TicketNumber": "PM-4", "Status": 2},
    {"Id": 5, "AssignedTo": "Alex", "Title": "Photo cropper bugs", "Description": "Photo cropper bugs", "Type": "Feature", "Priority": 9, "TicketNumber": "PM-5", "Status": 2},
    {"Id": 6, "AssignedTo"

pankajparkar

<div id="content">
    <navbar></navbar>
    <div class="container">
        <div class="row">
            <div class="col-sm-12">
                <router-outlet></router-outlet>
            </div>
        </div>
    </div>
</div>

pankajparkar

<ng-template #form>
  <form novalidate>
    <label>
      First Name
      <input name="firstName" />
      <!-- <span>This field is required</span> -->
    </label>
    <label>
      Last Name
      <input name="lastName" />

pankajparkar

<form>
  <mat-form-field>
    <input matInput placeholder="Operand 1" value="0" />
  </mat-form-field>
  <mat-form-field>
    <input matInput placeholder="Operand 2" value="0" />
  </mat-form-field>
</form>
<button mat-button>Add</button>
<button mat-button>Divide</button>

pankajparkar

//network Call
getDataFromServer().then(()=> {
   //state has changed
   detectChanges();
})

//timeout function
setTimeout(()=> {
   //Call change detection
   detectChanges();

pankajparkar

let detectChanges => () => {
  if(currentState != prevState) {
    updateView(currentState);
  }
}

pankajparkar

var myZoneSpec = {
  beforeTask: function () {
    console.log('Before task');
  },
  afterTask: function () {
    console.log('After task');
  }
};

var myZone = zone.fork(myZoneSpec);