javascript - 在单击任何对象之前，Angular 2 不会更新

Question

以下是我尝试根据 Angular 教程开始工作的内容。

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

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

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

      ngOnInit() {
          this.getRobots();
      }

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

和 View

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

sobots.data 看起来像预期的那样返回数据对象 - 但是它仍然不会更新，直到我点击任何按钮/路线/任何事件被触发。

控制台中没有错误显示，我很困惑!

我已经继续尝试确保它只是将数据添加到原始数组对象，但即使那样似乎也不起作用!

Answer 1

事实证明，sobotService 返回的是 q.js promise ，而不是 ES6 promise 。我相信这可能就是为什么它没有像我期望的那样更新，就像它在英雄教程中那样。

通过强制它在区域中更新例如:

  this.sobotService .getRobots().then(ODataRobots => {
      this.zone.run(() => this.sobots = ODataRobots.data);          
  });

一旦 promise 解决，它就设法更新 View 。

我可能必须弄清楚是否有一种简单的方法可以从我正在使用的库 (o.js) 中删除 q.js promise，但与此同时它会按预期工作!