Data is not bound to templates in angular2
<p>I am trying to get the results on search,I think the code is correct but the data is not bound. Yet I can see the results in the console.Can someone please help me?</p>

<p>My Template:
 </p>

<pre><code>        &lt;div id="header-wrap"&gt;

            &lt;div class="container clearfix"&gt;
                &lt;div class="divcenter" style="max-width:990px;"&gt;
                    &lt;div id="primary-menu-trigger"&gt;&lt;i class="icon-reorder"&gt;&lt;/i&gt;&lt;/div&gt;

                    &lt;!-- Logo
                ============================================= --&gt;
                    &lt;div id="logo" style="margin-top: 5px;"&gt;
                        &lt;a href="#" class="standard-logo" data-dark-logo="images/logo-dark.png"&gt;&lt;img src="assets/images/SW-Logo-Final.png" alt="Canvas Logo"&gt;&lt;/a&gt;


                    &lt;/div&gt;
                    &lt;span class="inputgroupcss col-sm-5" style="padding-top:12px;"&gt;


                                    &lt;input type="email"  (keyup)=0 (keyup)='submit(button.value)' #button  class="form-control required email" placeholder="Search by Name or Email"
                                        style="height:38px;"&gt;

                                &lt;div  class="col-sm-12 nopadding "&gt;

                                &lt;ul class="searchlist"&gt;
                                    &lt;li *ngFor="let detail of details"&gt;
                                        &lt;img [src]='detail.image' alt="profile_image" style="width: 35px;
                            height: 35px;"&gt;
                                        &lt;a [routerLink]="['/demo/user',detail.profilename]"&gt;{{detail.profilename}}&lt;/a&gt;
                                    &lt;/li&gt;

                                &lt;/ul&gt;    
                            &lt;/div&gt;


                        &lt;/span&gt;


                &lt;/div&gt;

            &lt;/div&gt;

        &lt;/div&gt;

    &lt;/header&gt;
</code></pre>

<p>My Component,</p>

<pre><code>    import {Component} from '@angular/core';
    import {ROUTER_DIRECTIVES,provideRouter} from '@angular/router';
    import {Http, Response, Headers} from '@angular/http';
    import {Observable} from 'rxjs/Observable';
    import { GetAllList } from './components/society/service';
    import { ISearch } from './components/search/details';
    import { IDetails } from './components/society/pro';
    import {Location} from '@angular/common';

    declare var System: any,jQuery:any;
 @Component({
    selector: 'demo-page',
      templateUrl: './demo-page.html',
    directives: [ROUTER_DIRECTIVES],
      providers: [GetAllList],
   })

  export class DemoPage {
     location:Location;
     details: ISearch[];
      list:IDetails[];
       constructor(location:Location,public http: Http,private _service:GetAllList) {
         this.location = location;
      //   console.log(this.location.path());
                this._service.getList()
            .subscribe(list =&gt; this.list = list);
          console.log(this.list);
     }

      submit(id): any {
        var headers = new Headers();
        headers.append('Content-Type', 'application/x-www-form-urlencoded')
    this.http.get('http://localhost/a2server/index.php/profile/search/' + id, { headers: headers })
           .subscribe(response =&gt; {
            if (response.json().error_code == 0) {
                   this.details = &lt;ISearch[]&gt;response.json().data;
                   // console.log(this.details);
            } else {
                this.details = [];
            }
            if (id == '') {
                this.details = [];
            }

        }

             )}


      }
</code></pre>

<p>my console,</p>

<pre><code>[Object, Object, Object, Object, Object, Object, Object, Object, Object]0: Objectactive: "1"connection_status: nullcountry: "Greenland"email: "s@gmail.com"firstname: "Sachin"friends_count: "5"image: ""lastname: "Tendulkar"password: "1"phone: "2"profile_id: "1"profilename: "sachin tendulkar"relation_id: nullrepeatpassword: nullstatus: "1"street: "Perry Cross Road,Mumbai"type: nullzip: ""__proto__: Object1: Object2: Object3: Object4: Object5: Object6: Object7: Object8: Objectlength: 9__proto__: Array[0]
</code></pre>