typescript 我是否必须取消订阅 ActivatedRoute（例如 params） observables？

Do I have to unsubscribe from ActivatedRoute (e.g. params) observables?

提问by hgoebl

I find many examples where ActivatedRouteObservables like paramsor urlare subscribed but not unsubscribed.

我发现了许多ActivatedRouteObservable 喜欢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);
}

• Are the route objects and subscriptions destroyed automagically and newly created for every component creation?
• Do I have to care about unsubscribing from those Observables?
• If not, can you explain what happens with the tree of ActivatedRoute objects in Router.routerState?

• 路由对象和订阅是否会自动销毁并为每个组件创建新创建？
• 我必须关心取消订阅那些Observables 吗？
• 如果没有，您能解释一下Router. routerState?

回答by Milad

From the docs:

从文档：

When subscribing to an observable in a component, you almost always arrange to unsubscribe when the component is destroyed.

当订阅组件中的 observable 时，您几乎总是安排在组件被销毁时取消订阅。

There are a few exceptional observables where this is not necessary. The ActivatedRoute observables are among the exceptions.

有一些特殊的 observables 是不必要的。ActivatedRoute observables 是例外。

The ActivatedRoute and its observables are insulated from the Router itself. The Router destroys a routed component when it is no longer needed and the injected ActivatedRoute dies with it.

ActivatedRoute 及其可观察对象与路由器本身绝缘。当不再需要路由组件并且注入的 ActivatedRoute 随之消失时，路由器会销毁路由组件。

Feel free to unsubscribe anyway. It is harmless and never a bad practice.

无论如何都可以取消订阅。这是无害的，从来都不是坏习惯。

回答by Günter Z?chbauer

The component will be destroyed and the routerState will become unreferenced when the router navigates to a different route, which will make them free to get garbage collected including the observable.

当路由器导航到不同的路由时，组件将被销毁并且 routerState 将变为未引用，这将使它们可以自由地收集垃圾，包括 observable。

If you pass around references to this component to other components or services, the component won't be garbage collected and the subscription would be kept active, but I'm sure (without verifying) that the observable will be completed by the router when navigating away and cause the subscription to cancel.

如果您将此组件的引用传递给其他组件或服务，则该组件不会被垃圾收集并且订阅将保持活动状态，但我确信（无需验证）可观察对象将在导航时由路由器完成并导致订阅取消。

回答by Marian07

As the winning answer quotesabout the subscriptionsto ActivatedRoute, Angular unsubscribesautomatically.

作为获奖的答案报价关于subscriptions到ActivatedRoute，角unsubscribes自动。

The Router destroys a routed component when it is no longer needed and the injected ActivatedRoute dies with it.

当不再需要路由组件并且注入的 ActivatedRoute 随之消失时，路由器会销毁路由组件。

In case you want to know how to unsubscribefrom Observables:

如果您想知道如何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 = this.activatedRoute.params.subscribe( params => {

    });
  }

  ngOnDestroy() {
    console.log("Component will be destroyed");
    this.paramsSubscription.unsubscribe();
  }

}

回答by thegautamnayak

Whenever you are adding subscribe to a component, you always almost need to unsubscribe when the component is getting destroyed. But subscribe to the Activated route params doesn't require to unsubscribe as the router destroys the subscribe whenever its no longer needed.

每当您添加订阅组件时，您几乎总是需要在组件被销毁时取消订阅。但是订阅激活的路由参数不需要取消订阅，因为路由器会在不再需要订阅时销毁订阅。

回答by Yair Abad

Http observables calls and router observables dont need to unsubscribe manually. In case you handle other kind of observbable or your own observable you should do it on ngOnDestroy(). You do it calling unsubscribe() method inside Suscription object where you storage your observable in the component.

Http observables 调用和路由器 observables 不需要手动取消订阅。如果您处理其他类型的 observbable 或您自己的 observable，您应该在 ngOnDestroy() 上进行。您可以在 Suscription 对象中调用 unsubscribe() 方法，在该对象中您将 observable 存储在组件中。