在Angular2中，使用zone.run与changeDecotor.markForCheck()的优点

Question

我想知道使用其中一种比另一种有什么优点或缺点：

 constructor(private app:ApplicationRef, private ref:ChangeDetectorRef) {
    this.ref.markForCheck();
    // OR
    this.ref.detectChanges()  
    // will do same thing?
 ...

与

zone.run

(() => doSomething())
    ...

与

  app.tick();

它们本质上都会标记组件以进行检查和更新/重绘 UI。

我知道app.tick()会对整个应用程序执行此操作，但在我的测试中它实际上并没有强制 UI 更新。

zone.run两者markforCheck都强制 UI 在下一个区域循环检查时更新，那么为什么要使用其中一个而不是另一个呢？

Answer 1

如果您运行的代码仅影响当前组件，例如

someServiceThatRunsOutsideZone.getData()
.subscribe(data => {
  this.data = data;
  this.ref.markForCheck();
});

this.ref.markForCheck()就很好了。

例如，如果您this.router.navigateXxx(...)在 Angulars 区域之外进行操作，那么很难知道是否this.ref.markForCheck()会覆盖所有可能因这个相当复杂的操作而改变其状态的元素。

此外，如果this.router.navigateXxx(...)调用一些异步调用，您markForCheck将在这些异步调用完成之前运行，并且不会在最后调用更改检测，因为这可能是必要的。

和

this.zone.run(() => this.router.navigateXxx(...))

这并不重要，因为this.router.navigateXxx()该调用（同步和异步）调用的所有代码都将在 Angulars 区域内运行并使用其修补的 API。

我不知道app.tick和之间的确切区别markForCheck，但app.tick也有上面解释的缺点markForCheck