typescript - Angular 9 cancelar suscripción NavigationEnd

Estoy usando una suscripción en router NavigationEnd de esta manera:

this.router.events
  .subscribe((event) => {
    if (event instanceof NavigationEnd) {
      this.getData();
    }
  });

Necesito esto para actualizar los datos de la página al navegar en la misma ruta, por ejemplo, /product1 y /product2 usan el mismo componente y ruta y se manejan en un servicio de rutas personalizado

Esto es para obtener datos cuando la ruta se actualiza en el mismo componente, y funciona como se espera

El problema es que esto.getData() también se ejecuta al navegar a otro componente, esto crea muchos problemas en el componente al que navego, y también ejecuto un get innecesario desde el servidor

Entonces la pregunta es: ¿Puedo darme de baja del router al salir del componente para que this.getData() no se ejecute?

Respuesta #1

Puedes usar Subscription en Observables

Primero, inicializa en tu componente

navigationSubs = new Subscription();


this.navigationSubs = this.router.events
  .subscribe((event) => {
    if (event instanceof NavigationEnd) {
      this.getData();
    }
  });

Al destruir o cuando quieras

this.navigationSubs.unsubscribe();