Должен ли я отказаться от подписки на activatedroute (например, params) observables?
Я нахожу много примеров, когда ActivatedRoute
наблюдаемые объекты, такие как params
или url
, подписаны, но не отписаны.
constructor(private route: ActivatedRoute) {}
ngOnInit() {
this.route.params
// (+) converts string 'id' to a number
.switchMap((params: Params) => this.service.getHero(+params['id']))
.subscribe((hero: Hero) => this.hero = hero);
}
- уничтожаются ли объекты маршрута и подписки автоматически и создаются ли они заново для каждого компонента?
- должен ли я заботиться о том, чтобы отписаться от этих
Observable
?
Если нет, можете ли вы объяснить, что происходит с деревом объектов ActivatedRoute в
Router
.routerState
?
3 ответа:
Подписываясь на наблюдаемое в компоненте, вы почти всегда отменяете подписку, когда компонент уничтожается.
Есть несколько исключительных наблюдаемых объектов, где в этом нет необходимости. Наблюдаемые объекты ActivatedRoute относятся к числу исключений.ActivatedRoute и его наблюдаемые объекты изолированы от самого маршрутизатора. Маршрутизатор уничтожает маршрутизируемый компонент, когда он больше не нужен, и введенная ActivatedRoute умирает с ним.
Не стесняйтесь отписываться в любом случае. Это безвредная и никогда не плохая практика.
Компонент будет уничтожен, и состояние маршрута станет неуправляемым, когда маршрутизатор перейдет на другой маршрут, что сделает их свободными для сбора мусора, включая наблюдаемый.
Если вы передадите ссылки на этот компонент другим компонентам или службам, компонент не будет собирать мусор, и подписка будет оставаться активной, но я уверен (без проверки), что наблюдаемое будет завершено маршрутизатором при навигации и вызовите отмену подписки.
Как выигрышный ответ цитирует О
subscriptions
кActivatedRoute
, угловойunsubscribes
автоматически.Если вы хотите знать, как
unsubscribe
изObservables
:import { Component, OnInit, OnDestroy } from '@angular/core'; import { ActivatedRoute } from '@angular/router'; // Type import { Subscription } from 'rxjs/Subscription'; @Component({ selector: 'app-example', templateUrl: './example.component.html', styleUrls: ['./example.component.scss'] }) export class ExampleComponent implements OnInit, OnDestroy { paramsSubscription : Subscription; constructor(private activatedRoute : ActivatedRoute) { } /* Angular lifecycle hooks */ ngOnInit() { console.log("Component initialized"); this.paramsSubscription = activatedRoute.params.subscribe( params => { }); } ngOnDestroy() { console.log("Component will be destroyed"); this.paramsSubscription.unsubscribe(); } }