Angular 2 : what make a service to be "Outside" angular zone?

标签 angular components observable zone

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

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

  • 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 在 View 中引用)
    this.myService.method().subscribe(e => {
        this.value = e;
      });
    

    是给定的服务不是 “外 Angular 区”, View 刷新,另一方面,如果 它是 “外 Angular 区”, View 不是 刷新,除非我们调用 ChangeDetectorRef.detectChanges()。

    所以问题是:知道服务是在“Angular 区”内部还是外部的条件是什么?

    最佳答案

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

    资料来源:在写这篇文章之前,我花了好几个小时阅读 Angular 文档。

    此外,您可以注入(inject) NgZone进入您的服务并尝试使用this.ngZone.run(() => yourSubscriberCallback())这应该会有所帮助,尽管我尝试这个的结果很复杂。

    编辑:好的,我设法让我的东西正常工作,让我们看看它是否对你有帮助。

    在我的例子中,我使用了一个第三方库,其中包括一个监听器来进行更改。我使用的是 RXJS BehaviorSubject通过服务将这些更改传播到各个组件,但这些更改没有被拾取。

    原来这是因为我在监听器中使用的方法是在 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 内收到了消息并触发了预期的更新。

    关于 Angular 2 : what make a service to be "Outside" angular zone?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44391696/

    相关文章:

    reactjs - 如何将带有 props 的组件作为 React 中的 props 传递给另一个组件

    angular - 这种在 Angular 中创建 HTTP 服务的方法是否正确?

    kotlin - RxJava Zip 可观察可迭代

    javafx - TornadoFX:在ValidationContext中比较2个表单值

    angular - 无法导出 'Buffer' 。只能从模块导出本地声明

    angular - Typescript 界面中的可选字段

    javascript - 如果响应式(Reactive)表单字段无效 Angular 5,则禁用兄弟按钮

    javascript - Angular2 同步 promise

    java - 编写一个程序来标记无向图的连通分量

    vb6 - 运行时错误 '429'