Angular 2：什么使服务成为“外部”角度区域？

Question

在 StackOverflow 上遇到与许多人相同的问题后，我无法理解什么是“外角区域”服务？

我已经检查了围绕这个主题的所有现有问题，这正是我需要问这个问题的原因：

• https://github.com/angular/angular/issues/5150
• Angular2：视图不会从订阅内部更新
• https://blog.thoughtram.io/angular/2016/02/22/angular-2-change-detection-explained.html
• http://blog.assaf.co/angular-2-change-detection-zones-and-an-example/

具有默认 ChangeDetectionStrategy 的任何组件中的代码示例：（ 考虑视图中引用的this.value）

this.myService.method().subscribe(e => {
    this.value = e;
  });

如果给定的服务不是“Outside angular zone”，则刷新视图，另一方面，如果是“Outside angular zone”，则视图不会刷新，除非我们调用ChangeDetectorRef.detectChanges()。

所以问题是：知道服务是在“角区”内部还是外部的条件是什么？

Answer 1

你想要的代码是NgZone.isInAngularZone(). 这将告诉您它是否在那里执行。

资料来源：在写这篇文章之前，我花了几个小时把头撞在墙上阅读 Angular 文档。

此外，您可以注入NgZone您的服务并尝试使用this.ngZone.run(() => yourSubscriberCallback())它应该有所帮助，尽管我尝试这样做的结果非常复杂。

编辑：好的，我设法让我的东西工作，让我们看看它是否对你有帮助。

就我而言，我使用的是包含更改侦听器的第三方库。我使用 RXJSBehaviorSubject通过服务将这些更改传播到各种组件，但这些更改没有被接收。

事实证明，这是因为我在侦听器中使用的方法是在 AngularZone 之外执行的。

起初我是这样做的：

export class Service {

  public BehaviorSubject<Thing> thingSubject = new BehaviorSubject<Thing>(new Thing());

  constructor(private ngZone:NgZone) {
    thirdPartyLibrary.listen(ngZone.run(() => myCallback.bind(_this)));
  }

  ...

}

并且myCallback正在做：

myCallback(thing) {
  this.thingSubject.next(thing);
}

事实证明，这似乎没有在 Angular Zone 内正确执行。我把我的代码改成了这个，但它起作用了：

export class Service {

  public BehaviorSubject<Thing> thingSubject = new BehaviorSubject<Thing>(new Thing());

  constructor(private ngZone:NgZone) {
    thirdPartyLibrary.listen(myCallback.bind(_this));
  }

  myCallback(thing) {
    this.ngZone.run(() => this.thingSubject.next(thing));
  }

}

这样做之后，我的所有订阅者都在 Angular Zone 内收到了消息并触发了预期的更新。