[英]Angular 6 Prevent memory leaks multiple Observable in a component using takeUntil
I am following 2nd example from this site: https://www.agiratech.com/how-to-prevent-memory-leaks-in-angular-observables/ 我正在从此站点跟踪第二个示例: https : //www.agiratech.com/how-to-prevent-memory-leaks-in-angular-observables/
I would like to know if I have multiple Observables in a component, do I need to create that many references to the Subject object. 我想知道一个组件中是否有多个Observable,是否需要创建许多对Subject对象的引用。 I have used unsubscribe and unsubscribe1 variables.
我已经使用了unsubscribe和unsubscribe1变量。 Should I be re-using unsubscribe in different methods, or create new Subject instance for each time I subscribe?
我应该在其他方法中重新使用取消订阅,还是每次订阅都创建一个新的Subject实例? Code did not throw error in either case.
两种情况下代码均不会引发错误。
Here is my code: 这是我的代码:
import { Component, OnDestroy, OnInit } from '@angular/core';
import { Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators';
import { ProjDetailsService } from '../../services/proj-details.service';
@Component({
selector: 'app-proj-details',
templateUrl: './proj-details.component.html',
styleUrls: ['./proj-details.component.scss']
})
export class ProjDetailsComponent implements OnInit {
private unsubscribe = new Subject();
private unsubscribe1 = new Subject();//is this required?
constructor(public _projDetailsService: ProjDetailsService
) {
}
ngOnInit() {
this.LoadApprovalManager();
this.LoadActiveProjectSubmissions();
}
public LoadApprovalManager() {
this._projDetailsService.GetDefaultMgrGeidData()
.pipe(takeUntil(this.unsubscribe))
.subscribe(result => {
}, error => {
//this.ErrorMessage('Unable to load search data ' + error.toString());
//this.SelectedApproverManager = '';
});
}
LoadActiveProjectSubmissions() {
this._projDetailsService.GetActiveProjectSubmissions()
.pipe(takeUntil(this.unsubscribe1))
.subscribe(x => {
//processing
}, error => {
// this.ErrorMessage(error.toString());
});
}
ngOnDestroy() {
this.unsubscribe.next();
this.unsubscribe.complete();
this.unsubscribe1.next();
this.unsubscribe1.complete();
}
}
following that example, the answer is no. 根据该示例,答案是否定的。 You would use the same unsubscribe signal for all observables like this:
您将对所有可观察对象使用相同的取消订阅信号,如下所示:
export class ProjDetailsComponent implements OnInit {
private unsubscribe = new Subject();
constructor(public _projDetailsService: ProjDetailsService
) {
}
ngOnInit() {
this.LoadApprovalManager();
this.LoadActiveProjectSubmissions();
}
public LoadApprovalManager() {
this._projDetailsService.GetDefaultMgrGeidData()
.pipe(takeUntil(this.unsubscribe))
.subscribe(result => {
}, error => {
//this.ErrorMessage('Unable to load search data ' + error.toString());
//this.SelectedApproverManager = '';
});
}
LoadActiveProjectSubmissions() {
this._projDetailsService.GetActiveProjectSubmissions()
.pipe(takeUntil(this.unsubscribe))
.subscribe(x => {
//processing
}, error => {
// this.ErrorMessage(error.toString());
});
}
ngOnDestroy() {
this.unsubscribe.next();
this.unsubscribe.complete();
}
}
However, all due respect to the folks at that site, I think this method makes no sense whatsoever and increases boiler plate code to absurd levels when you could just do this: 但是,对那个站点的所有人都应有的尊重,我认为这种方法毫无意义,并且在您可以这样做时将样板代码增加到荒谬的水平:
export class ProjDetailsComponent implements OnInit {
private subs: Subscription[] = [];
constructor(public _projDetailsService: ProjDetailsService
) {
}
ngOnInit() {
this.LoadApprovalManager();
this.LoadActiveProjectSubmissions();
}
public LoadApprovalManager() {
this.subs.push(this._projDetailsService.GetDefaultMgrGeidData()
.subscribe(result => {
}, error => {
//this.ErrorMessage('Unable to load search data ' + error.toString());
//this.SelectedApproverManager = '';
}));
}
LoadActiveProjectSubmissions() {
this.subs.push(this._projDetailsService.GetActiveProjectSubmissions()
.subscribe(x => {
//processing
}, error => {
// this.ErrorMessage(error.toString());
}));
}
ngOnDestroy() {
this.subs.forEach(s => s.unsubscribe());
}
}
simple uniform approach to subscription management that doesn't pollute your observables with extra steps in the pipe. 订阅管理的简单统一方法,不会增加管道中的额外步骤,不会污染您的可观察对象。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.