需要取消订阅 Firestore/Angularfire2 订阅答案

【问题标题】：Need to unsubscribe Firestore/Angularfire2 subscription需要取消订阅 Firestore/Angularfire2 订阅
【发布时间】：2018-09-03 09:58:24
【问题描述】：

我像这样使用 Firestore。

用例 1：

contacts$: Observable<ContactDetail[]>;

constructor(){    
} 

ionViewDidEnter() {
   this.contacts$ = this.contactProvider.getSpecificUserContacts(this.authenticationProvider.user.uid).valueChanges();
   this.contacts$.pipe(first()).subscribe(res => { },
      err => { },
      () => { }
   );
}

用例 2：

getAllContactCategories() {
    this.categories$ = this.categoryProvider.getAllContactCategories().valueChanges();
    this.categories$.subscribe(res => {
       this.categorySortedList = res;          
    },
      err => { }
    );
}

但我从来没有unsubscribed它。那我需要这样做吗？否则会导致内存泄漏和耗尽电池使用量吗？我知道我们不需要unsubscribed angular HTTP 服务，因为它是由框架本身自动完成的。那么 Firestore/Angularfire2 observables 呢？我从未在 Firestore 书籍或文章中看到过这样的模式。

【问题讨论】：

first() 收到第一个值后自动退订..
好的，很高兴知道这件事。 用例 2 呢？ @JeffreyRoosendaal
我对firestore一无所知，只是想指出first()。 take(N) 和 `takeUntil(X) 这样的管道也是如此。
对于一般退订，请查看this post。它在选中的答案中为 Angular 提供了一个很棒的“官方”解决方案（takeUntil() 方法）

标签： angular firebase ionic3 google-cloud-firestore angularfire2

【解决方案1】：

是的，取消订阅订阅的内容很好。你可以试试这个……

  contactsSub: Subscription;

构造函数(){
}

ionViewDidEnter() { ... }

  ionViewDidLeave{
  this.contactsSub.unsubscribe();
  }

来自 angularfire2 代表： https://github.com/angular/angularfire2/issues/377

【讨论】：

是的，它适用于任何自定义事件的订阅。我在这里的具体问题是Firestore/Angularfire2。使用此模式对它有任何引用吗？

【解决方案2】：

通过使用first() 运算符，您将在最初触发订阅后直接自动取消订阅。但要回答您的具体问题。

订阅组件中的 observable 时，您几乎总是安排在组件销毁时取消订阅。有一些特殊的 observables 是不必要的。 ActivatedRoute 可观察对象属于例外。 ActivatedRoute 及其 observables 与 Router 本身是绝缘的。当不再需要路由组件时，Router 会销毁路由组件，并且注入的 ActivatedRoute 会随之消亡。

请随时退订。这是无害的，绝不是坏习惯。

来自https://angular.io/guide/route

一般来说，如果您希望控制何时取消订阅，您可以将 observable 分配给一个变量

const subscription = this.subscription$.valueChanges().subscribe(...);

然后在新创建的变量上调用 unsubscribe。

subscription.unsubscribe();

【讨论】：

我知道自定义订阅事件的这种模式。但是使用 firestore/anglurafire2 如何处理呢？你有没有看到任何文档或类似的东西作为参考？
@Sampath Angularfire 使用 RxJS observables。这是官方文档的链接reactivex.io/rxjs/class/es6/…
是的，Angular HTTP 服务也使用RxJS。但是我们不需要在那里手动完成。为什么我们需要它？我希望看到有关它的官方文档或文章。我还没有找到。
啊。一些内置的 angular observables 可以控制它们的生命周期，因此当调用组件 onDestoy 时它们会自动取消订阅。在我的脑海中，这些包括 HTTPClient、Router 和其他一些。一般来说，如果它不是 @angular sdk 的一部分，您应该手动取消订阅。我会看看我是否能找到一些资源来支持我。
@Sampath 做了一些挖掘，我似乎找不到自动处理退订的完整列表，但您会在我更新的答案中找到官方文档的摘录。希望这会有所帮助