Angular 2 not updating until any object is clicked
<p>The following is something I'm trying to get working based on the Angular Tutorial.</p>

<pre><code>export class DashboardComponent implements OnInit {
      title = 'Current Robots';
      private sobots: Robot[];

      constructor(
        private router: Router,
        private sobotService: RobotService) { 
      }

      getRobots() { 
          this.sobotService.getRobots().then(sobots =&gt; Array.prototype.push.apply(this.sobots, sobots.data));     
      }

      ngOnInit() {
          this.getRobots();
      }

      gotoDetail(sobot: Robot) {
        let link = ['/detail', sobot.Id];
        this.router.navigate(link);
      }
</code></pre>

<p>And the View</p>

<pre><code>&lt;h3&gt;{{title}}&lt;/h3&gt;
&lt;div class="grid grid-pad"&gt;        
  &lt;div *ngFor="let sobot of sobots" (click)="gotoDetail(sobot)" class="col-1-4"&gt;
    &lt;div class="module sobot"&gt;
      &lt;p&gt;HostKey&lt;/p&gt;
      &lt;h4&gt;{{sobot.HostKey}}&lt;/h4&gt;
    &lt;/div&gt;
  &lt;/div&gt;
&lt;/div&gt;
&lt;sobot-search&gt;&lt;/sobot-search&gt;
</code></pre>

<p>sobots.data looks to be returning the data object as expected - however it's still not updating until I click on any button/route/any event is fired.</p>

<p>No errors show up in the console and I'm quite confused!</p>

<p>I've gone ahead and tried to ensure that it's only adding data to the original array object but even that doesn't seem to work!</p>