angular 2.0等效于$ scope。$ apply

Question

我试图开始使用angular 2.0，现在我想知道在某些外部事件更改数据后如何启动视图更新。

详细来说，我有一个Google地图和一个用于地图上单击事件的处理程序。用户单击地图后，我将单击的纬度和经度存储到控制器上的变量中

this.lat = event.latLng.lat();
this.lon = event.latLng.lon();

在视图中，我想显示这些值

<div> this is my spot: {{lat}} and {{lon}} </div>

在角度1中，我只需在对$ scope。$ apply（）的调用中将分配包装在控制器中即可。

在Angluar 2.0中更新视图的首选方法是什么？

Answer 1

通常，您无需执行任何操作即可更新视图。zone.js将为您做一切。

但是，如果由于某种原因要手动触发更改检测（例如，如果代码在角度区域之外运行），则可以使用LifeCycle::tick()method来执行。看到这个矮人

import {Component, LifeCycle, NgZone} from 'angular2/angular2'

@Component({
  selector: 'my-app',
  template: `
    <div>
      Hello world!!! Time: {{ time }}.
    </div>
  `
})
export class App {
  time: number = 0;

  constructor(lc: LifeCycle, zone: NgZone) {
    zone.runOutsideAngular(() => {
      setInterval(() => {
        this.time = Date.now();

        lc.tick(); // comment this line and "time" will stop updating
      }, 1000);
    })
  }
  doCheck() {
    console.log('check', Date.now());
  }
}