Question

我正在使用apollo-angular构建一个角度（4.x）应用程序，我想知道如何取消订阅apollo observable（如果你需要的话）。

我尝试通过创建查询来遵循this response中的指南：

this.query = this.apollo.watchQuery<LatestReportQueryResponse>({
  fetchPolicy: 'network-only',
  query: myQuery
});

分配新主题：

  private ngUnsubscribe: Subject<void> = new Subject<void>();

订阅查询：

this.query.takeUntil(this.ngUnsubscribe).subscribe(({ data }) => {...}

然后在onDestroy事件周期中销毁所有活动的observable，例如：

ngOnDestroy() {
    this.ngUnsubscribe.next();
    this.ngUnsubscribe.complete();
  }

添加.takeUntil(this.ngUnsubscribe)后，我遇到了lint错误，如：

类型＆＃39;主题＆＃39;不能分配给＆＃39; Observable＆＃39;。
类型的参数

或者当我尝试手动取消订阅ApolloQueryObservable时，我得到：

财产＆＃39;取消订阅＆＃39;类型＆＃39; ApolloQueryObservable＆＃39;中不存在。你是说＆＃39;订阅＆＃39;？

apollo observables是否需要取消订阅？

Answer 1

尽管问题正在回答，但是这是一个更具体的场景，它对该问题的解释更多，因此请在此处在博客下面添加链接。 https://www.digitalocean.com/community/tutorials/angular-takeuntil-rxjs-unsubscribe

Answer 2

this.query.takeUntil(this.ngUnsubscribe).subscribe(...)的返回值应该为您提供取消订阅功能。

订阅并保存取消订阅功能：

this.unsubscribe = this.query.takeUntil(this.ngUnsubscribe).subscribe(...)

在onDestroy事件周期中，调用函数：

this.unsubscribe()

Answer 3

import { from, Subscription } from 'rxjs';

export class CalendarWeekViewStdComponent implements OnInit, OnDestroy, AfterViewInit {
private subscriptionName: Subscription;

ngOnInit() {
this.subscriptionName = this.settingService.diarySettings.subscribe(settings => {

 });
}
  ngOnDestroy(): void {
if (this.subscriptionName) {
      this.subscriptionName.unsubscribe();
    }
}
}

Answer 4

我们经常使用一种干净的方法，使您可以处理第二个可观察的ngUnsubscribe。

它包括 1-将您的订阅存储在类型为Subscription的属性中， 2-销毁后，您必须调用此属性的订阅。

如果您有多个订阅，则可以使用数组

import { from, Subscription } from 'rxjs';

private subscriptions: Subscription[] = [];
ngOnInit() {
this.subscriptions.push( this.settingService.diarySettings.subscribe(settings => {

 }));
}
ngOnDestroy(): void {
  this.subscriptions.forEach(sub => sub.unsubscribe());
 }

你如何取消订阅有角度的阿波罗观察？

4 个答案: