Должен ли я отказаться от подписки на наблюдаемые переменные ActivatedRoute (например, params)?

Я нахожу много примеров, где 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 s?
Если нет, можете ли вы объяснить, что происходит с деревом объектов ActivatedRoute в Router. routerState?

Ответы

Ответ 1

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

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

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

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

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

Ответ 2

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

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

Ответ 3

Как выигрышный ответ автоматически цитирует о subscriptions - ActivatedRoute, Angular 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();
  }

}