title: Array being updated but view is not in Angular 2
body: <p>I have a component that stores an array of servers for display in a list. The component subscribes to an observable from a service. </p>
  
  <p>This is the component code: </p>
  
  <pre><code>import {Client} from '../../connectionService/client.service';
  
  
  @Component({
      templateUrl: 'build/pages/page1/page1.html',
      providers: [Client]
  })
  export class Page1 {
      servers : any;
  
      constructor(private client: Client) {
        this.servers = [];
        this.client._myServers.subscribe((newServer: any) =&gt; {
          console.log("new server!", newServer);
          this.servers.push(newServer);
        });
  }
  </code></pre>
  
  <p>The view: </p>
  
  <pre><code>  &lt;ul&gt;
      &lt;li *ngFor='#item of (servers)'&gt;
       Name : {{item.name}}
    &lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>The service: </p>
  
  <pre><code>import { Injectable } from '@angular/core';
  import {Observable}     from 'rxjs/Observable';
  import {Subject}  from 'rxjs/Subject';
  
  
      @Injectable()
      export class Client {
        private serversSubject: Subject&lt;any&gt;;
        _myServers : Observable&lt;ServerHandler&gt;;
  
      constructor() {
          this.serversSubject = new Subject&lt;any&gt;();
          this._myServers = this.serversSubject.asObservable();
      }
  </code></pre>
  
  <p>...</p>
  
  <p>When I found a server(in the same service as above: </p>
  
  <pre><code>      this.serversSubject.next({"name": result.name, "adress": result.address});
  </code></pre>
  
  <p>"new server!" gets printed, and the servers is updated in the component, <strong>but the view don't show the new items</strong>. When I go in and out of the page the new servers appear. </p>
  
  <p>Thanks in advance, 
  Markus</p>