Должен ли я отказаться от подписки на 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 18

3 ответа:

Из документов :

Подписываясь на наблюдаемое в компоненте, вы почти всегда отменяете подписку, когда компонент уничтожается.

Есть несколько исключительных наблюдаемых объектов, где в этом нет необходимости. Наблюдаемые объекты ActivatedRoute относятся к числу исключений.

ActivatedRoute и его наблюдаемые объекты изолированы от самого маршрутизатора. Маршрутизатор уничтожает маршрутизируемый компонент, когда он больше не нужен, и введенная ActivatedRoute умирает с ним.

Не стесняйтесь отписываться в любом случае. Это безвредная и никогда не плохая практика.

Компонент будет уничтожен, и состояние маршрута станет неуправляемым, когда маршрутизатор перейдет на другой маршрут, что сделает их свободными для сбора мусора, включая наблюдаемый.

Если вы передадите ссылки на этот компонент другим компонентам или службам, компонент не будет собирать мусор, и подписка будет оставаться активной, но я уверен (без проверки), что наблюдаемое будет завершено маршрутизатором при навигации и вызовите отмену подписки.

Как выигрышный ответ цитирует О subscriptions к ActivatedRoute, угловой unsubscribes автоматически.

Маршрутизатор уничтожает маршрутизируемый компонент, когда он больше не нужен, и введенная ActivatedRoute умирает вместе с ним.

Если вы хотите знать, как 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();
  }

}