在这些情况下是否有必要订阅和删除可观察对象?
Is it necessary to subscribe and remove observables it in these cases?
我在这里考虑 observables ..
而我想象了以下情况:
示例 1)
就我而言,当我使用 NGRX
时,我正确地创建了所有架构,并为该特定商店创建了一个选择器服务。
在服务中无法使用 ngOnDestroy,因为它不是组件,我有以下问题,服务中是否存在内存泄漏?还是这个服务会自动销毁可观察对象?
示例 2)
使用示例一的选择器,是否需要订阅这个选择器然后销毁?
人-SELECTORS.SERVICE
@Injectable({ providedIn: 'root' })
export class PeopleSelectorsService {
constructor(private readonly store: Store<StoreState>) {}
get error(): Observable<IRequestError> {
return this.store.pipe(select(fromPeopleSelectors.getError));
}
get loading(): Observable<boolean> {
return this.store.pipe(select(fromPeopleSelectors.getLoading));
}
get main(): Observable<IPeople> {
return this.store.pipe(select(fromPeopleSelectors.getMain));
}
get total(): Observable<number> {
return this.store.pipe(select(fromPeopleSelectors.selectTotal));
}
get all(): Observable<Array<IPeople>> {
return this.store.pipe(select(fromPeopleSelectors.selectAll));
}
get allIds(): Observable<Array<string | number>> {
return this.store.pipe(select(fromPeopleSelectors.selectIds));
}
}
APP.COMPONENT
ngOnInit(): void {
this.peopleDispatchService.getAll();
this.isLoading$ = this.peopleSelectorsService.loading;
}
<main [attr.isLoading]="isLoading$ | async">
<ng-container></ng-container>
<app-loading-container *ngIf="isLoading$ | async; else isMainController"></app-loading-container>
<ng-template #isMainController>
<app-user-talk-controller-container></app-user-talk-controller-container>
<app-user-talk-container></app-user-talk-container>
</ng-template>
</main>
这完全正常。
在您订阅之前,您不会有任何内存泄漏。
async
pipe 知道何时订阅和何时取消订阅,因此您不必担心忘记订阅,async
将在不再需要订阅时取消订阅。
最好的方法是在没有订阅恕我直言的情况下编写充满管道的代码。
例如,在您的情况下,我将在 app.component.ts 中创建一个单独的可观察对象,它将所有数据组合在一起并具有一个单独的可观察对象。
ngOnInit(): void {
this.data$ = combineLatest(
this.peopleSelectorsService.loading,
this.peopleSelectorsService.all,
).map(([isLoading, records]) => ({isLoading, records}));
}
<ng-container *ngIf="data$ | async as data">
<main [attr.isLoading]="data.isLoading">
<ng-container></ng-container>
<app-loading-container *ngIf="data.isLoading; else isMainController"></app-loading-container>
<ng-template #isMainController>
<app-user-talk-controller-container></app-user-talk-controller-container>
<app-user-talk-container [records]="data.records"></app-user-talk-container>
</ng-template>
</main>
</ng-container>
我看到的主要好处是我们有单一订阅,没有订阅交集的问题,因为有时在模板中有多个嵌套时 async
你会发现它们可以相互依赖太,他们将无法正常工作。单次订阅就没有这样的问题。
这也是我们在当前项目中所做的。有时 data$
很大,但感觉仍然比在一个模板或 class.
中订阅多个订阅要好
is there a memory leak in a service? Or does this service automatically destroy observables?
销毁可观察对象的概念没有任何意义。您销毁订阅(通过取消订阅),而不是可观察对象。所以不,没有必要 "destroy" 您服务中的可观察对象。
关于你的第二点,不。当组件被销毁时,异步管道会自动取消订阅。所以只要在html模板中使用async
,就不用担心订阅和退订
我在这里考虑 observables ..
而我想象了以下情况:
示例 1)
就我而言,当我使用 NGRX
时,我正确地创建了所有架构,并为该特定商店创建了一个选择器服务。
在服务中无法使用 ngOnDestroy,因为它不是组件,我有以下问题,服务中是否存在内存泄漏?还是这个服务会自动销毁可观察对象?
示例 2) 使用示例一的选择器,是否需要订阅这个选择器然后销毁?
人-SELECTORS.SERVICE
@Injectable({ providedIn: 'root' })
export class PeopleSelectorsService {
constructor(private readonly store: Store<StoreState>) {}
get error(): Observable<IRequestError> {
return this.store.pipe(select(fromPeopleSelectors.getError));
}
get loading(): Observable<boolean> {
return this.store.pipe(select(fromPeopleSelectors.getLoading));
}
get main(): Observable<IPeople> {
return this.store.pipe(select(fromPeopleSelectors.getMain));
}
get total(): Observable<number> {
return this.store.pipe(select(fromPeopleSelectors.selectTotal));
}
get all(): Observable<Array<IPeople>> {
return this.store.pipe(select(fromPeopleSelectors.selectAll));
}
get allIds(): Observable<Array<string | number>> {
return this.store.pipe(select(fromPeopleSelectors.selectIds));
}
}
APP.COMPONENT
ngOnInit(): void {
this.peopleDispatchService.getAll();
this.isLoading$ = this.peopleSelectorsService.loading;
}
<main [attr.isLoading]="isLoading$ | async">
<ng-container></ng-container>
<app-loading-container *ngIf="isLoading$ | async; else isMainController"></app-loading-container>
<ng-template #isMainController>
<app-user-talk-controller-container></app-user-talk-controller-container>
<app-user-talk-container></app-user-talk-container>
</ng-template>
</main>
这完全正常。
在您订阅之前,您不会有任何内存泄漏。
async
pipe 知道何时订阅和何时取消订阅,因此您不必担心忘记订阅,async
将在不再需要订阅时取消订阅。
最好的方法是在没有订阅恕我直言的情况下编写充满管道的代码。
例如,在您的情况下,我将在 app.component.ts 中创建一个单独的可观察对象,它将所有数据组合在一起并具有一个单独的可观察对象。
ngOnInit(): void {
this.data$ = combineLatest(
this.peopleSelectorsService.loading,
this.peopleSelectorsService.all,
).map(([isLoading, records]) => ({isLoading, records}));
}
<ng-container *ngIf="data$ | async as data">
<main [attr.isLoading]="data.isLoading">
<ng-container></ng-container>
<app-loading-container *ngIf="data.isLoading; else isMainController"></app-loading-container>
<ng-template #isMainController>
<app-user-talk-controller-container></app-user-talk-controller-container>
<app-user-talk-container [records]="data.records"></app-user-talk-container>
</ng-template>
</main>
</ng-container>
我看到的主要好处是我们有单一订阅,没有订阅交集的问题,因为有时在模板中有多个嵌套时 async
你会发现它们可以相互依赖太,他们将无法正常工作。单次订阅就没有这样的问题。
这也是我们在当前项目中所做的。有时 data$
很大,但感觉仍然比在一个模板或 class.
is there a memory leak in a service? Or does this service automatically destroy observables?
销毁可观察对象的概念没有任何意义。您销毁订阅(通过取消订阅),而不是可观察对象。所以不,没有必要 "destroy" 您服务中的可观察对象。
关于你的第二点,不。当组件被销毁时,异步管道会自动取消订阅。所以只要在html模板中使用async
,就不用担心订阅和退订