我想知道是否过于频繁地使用了Observable.subscribe()。
在我的组件类中,我有一个名为loadData()的函数。它调用另一个函数this.service.getData(),使用HttpClient.get()向服务器执行HTTP请求。
目前在我的loadData()函数中,我订阅了this.service.getData()的结果。
每当用户单击“更新”按钮时,我都希望调用我的loadData()函数。
问题
- 如果每次需要执行HTTP请求时都调用我的loadData()函数,那么我会创建多个订阅者吗?
- 是否存在内存泄漏的风险?
- 如果有,你知道我该如何重构我的代码吗?
答案
- 我发现了另一篇帖子Is it necessary to unsubscribe from observables created by Http methods?
- 它解释了Angular代码实际上在HTTP请求后会延迟调用observable.complete()
- 因此,我修改了下面的代码来检查这个事实,并且测试证实它是正确的
代码示例
private loadData() {
this.loading = true;
const subscription = this.service.getData()
.pipe(
// console.log() with a delay added for test - START
map(val => {
window.setTimeout(() => {
// This will print true.
console.log('After delay: Is Subscriber closed?', subscription.closed);
}, 10);
return val;
}),
// console.log() with a delay added for test - END
takeUntil(this.ngUnsubscribe))
.subscribe(data => {
this.data = data;
// This will print false.
console.log('Is Subscriber closed?', subscription.closed);
},
error => {
console.error(error);
throw error;
},
() => {
this.loading = false;
});
}
getData(): Observable<DataObject> {
const uri = encodeURI(this.configService.getUri());
const headers = new HttpHeaders();
if (this.pipelineEtag) {
headers.set('If-None-Match', this.pipelineEtag);
}
return this.http.get(uri, {
headers: headers,
observe: 'response'
}).pipe(
map(resp => this.processResponse(resp)),
catchError(error => this.handleError(error, this.envProduction))
);
}
this.x = this.myService.getData().subscribe(...)
并手动取消订阅,或者为你的请求实现缓存系统。 - user4676340