在 http 调用的情况下，Angular 2 订阅/取消订阅 Observables [英] Angular 2 Subscribe / Unsubscribe Observables in case of http calls

问题描述

我最近了解到我们必须在 Angular 销毁组件之前取消订阅，否则可能会造成内存泄漏.

I recently came to know that we must unsubscribe the subscription before Angular destroys the component, and failure to do so could create a memory leak.

我也知道我们可以获取订阅的引用，并通过对该订阅调用取消订阅方法，我们可以订阅.例如

I also know that we can get a reference to the subscription and by calling unsubscribe method on that subscription we can subscribe. For example

private sub: any;

ngOnInit() {
  this.sub = this.route.params.subscribe(params => {
     let id = +params['id']; // (+) converts string 'id' to a number
     this.service.getHero(id).then(hero => this.hero = hero);
   });
}


ngOnDestroy() {
  this.sub.unsubscribe();
}

这在 HTTP 调用的情况下也有必要吗?如果是，那么这种情况下的最佳做法是什么.

Is this necessary in the case of HTTP calls as well? If yes, then what's the best practice in this case.

比如我们通常有这样的东西通过HTTP发布一些数据

For example, we usually have something like this to post some data through HTTP

let body = JSON.stringify({ name });
let headers = new Headers({ 'Content-Type': 'application/json' });
let options = new RequestOptions({ headers: headers });

this.http.post(this.heroesUrl, body, options)
                .map(this.extractData)
                .subscribe((data) => {
                 //do something with data
                })
                .catch(this.handleError);

以下是否有效，是否是 HTTP 调用情况下取消订阅的最佳方式?

Will the below work, and is it the best way to unsubscribe in the case of HTTP calls?

private sub: any;

.....
....

this.sub = this.http.post(this.heroesUrl, body, options)
                .map(this.extractData)
                .subscribe((data) => {
                 //do something with data
                 this.sub.unsubscribe();
                })
                .catch(this.handleError);

推荐答案

不，没有必要取消订阅.简而言之，NG2 会自行清理，如下所示 此处:

No, it is not necessary to unsubscribe. In short, NG2 will clean up after itself as seen here:

    if (response.ok) {
      responseObserver.next(response);
      // TODO(gdi2290): defer complete if array buffer until done
      responseObserver.complete();
      return;
    }
    responseObserver.error(response);
  };

这篇关于在 http 调用的情况下，Angular 2 订阅/取消订阅 Observables的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！