角度2:什么使服务成为“外部"?角区? [英] Angular 2 : what make a service to be "Outside" angular zone?

查看:105
本文介绍了角度2:什么使服务成为“外部"?角区?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

在与StackOverflow上的许多人遇到相同的问题之后,我无法理解什么是外部角度区域"服务?

After having same issues as many people on StackOverflow i didn't manage to understand what is an "Outside angular zone" Service ?

我已经检查了有关该主题的所有现有问题,这正是为什么我需要问这个问题的原因:

I've checks all existing questions around this subject, and it's exactly why i needer to ask this one :

  • https://github.com/angular/angular/issues/5150
  • Angular2: view is not updated from inside a subscription
  • 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 )

Code Example in any component with default ChangeDetectionStrategy : (considering this.value referenced in view)

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

给定服务不是外部角度区域",则刷新视图 ,如果角区域",则视图不会刷新,除非,我们将其称为ChangeDetectorRef.detectChanges().

Is the given service is not "Outside angular zone", the view is refreshed, on the other hand, if it's "Outside angular zone", the view is not refreshed, unless we call ChangeDetectorRef.detectChanges().

所以问题是:要知道服务在"Angular Zone"内部还是外部的条件是什么?

So the question is : what the condition to know if a service is Inside or Outside "Angular Zone" ?

推荐答案

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

The code you want is NgZone.isInAngularZone(). This will tell you whether or not it's executing there.

资料来源:在撰写本文之前,数小时不停地将头撞墙阅读Angular文档.

Source: hours of banging my head against the wall reading Angular docs before writing this.

另外,您可以将NgZone注入服务中,并尝试使用this.ngZone.run(() => yourSubscriberCallback())这应该会有所帮助,尽管我尝试此操作的结果非常复杂.

Additionally, you can inject NgZone into your service and try using this.ngZone.run(() => yourSubscriberCallback()) which should help, though I'm having very mixed results attempting this.

好的,我设法使我的东西正常工作,让我们看看它是否对您有帮助.

Okay, I managed to get my stuff working, let's see if it helps you.

就我而言,我正在使用包含用于更改的侦听器的第三方库.我当时使用RXJS BehaviorSubject通过服务将这些更改传播到各个组件,但是这些更改没有被提取.

In my case I was using a third party library that included a listener for changes. I was using an RXJS BehaviorSubject to propagate these changes to various components via a service, but the changes weren't being picked up.

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

It turns out that this was because the method I used in the listener was executing outside of the 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中正确执行.我将代码更改为此,但是它起作用了:

Turns out this didn't seem to execute within the Angular Zone correctly. I changed my code to this though and it worked:

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区域内收到了消息,并触发了预期的更新.

After doing that all my subscribers received the message within the Angular Zone and triggered the expected updates.

这篇关于角度2:什么使服务成为“外部"?角区?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆