#angular #rxjs #observable #ondestroy
#угловатый #rxjs #наблюдаемый #ondestroy #angular
Вопрос:
Я следую 2-му примеру с этого сайта:https://www.agiratech.com/how-to-prevent-memory-leaks-in-angular-observables /
Я хотел бы знать, есть ли у меня несколько наблюдаемых в компоненте, нужно ли мне создавать так много ссылок на объект Subject. Я использовал переменные unsubscribe и unsubscribe1. Должен ли я повторно использовать отмену подписки другими методами или создавать новый экземпляр Subject для каждого раза, когда я подписываюсь? Код не выдал ошибку ни в том, ни в другом случае.
Вот мой код:
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();
}
}
Ответ №1:
следуя этому примеру, ответ отрицательный. Вы бы использовали один и тот же сигнал отмены подписки для всех наблюдаемых, подобных этому:
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();
}
}
Однако, при всем уважении к людям на этом сайте, я думаю, что этот метод не имеет никакого смысла и увеличивает код котельной плиты до абсурдных уровней, когда вы могли бы просто сделать это:
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());
}
}
простой унифицированный подход к управлению подписками, который не загрязняет ваши наблюдаемые данные дополнительными шагами в канале.
Комментарии:
1. импорт {подписки} из ‘rxjs’;
2. да, вам нужно будет импортировать тип, чтобы объявить его.