Saltar al contenido

¿Cómo ejecutar una función cuando una ruta cambia en angular?

Hola usuario de nuestra página, descubrimos la solución a lo que necesitas, desplázate y la obtendrás aquí.

Solución:

Puedes subscribe a router event en el app.component.ts. Se disparará cada vez que cambie el route.

  constructor(location: Location, router: Router) 
    // decide what to do when this event is triggered.
    router.events.subscribe(val => 
      if (location.path() != "/something") 
          // do something
       else 
         // do something else
      
    );
  

Prueba esto si llama varias veces

router.events.filter(event => event instanceof NavigationEnd).subscribe(val =>  // here your code... )

Nota: no he probado esto


Vaya a este enlace de StackBlitz

En cada evento de inicio de navegación del enrutador, puede obtener la función url y fire. en tu app.component.ts

ngOnInit()
   this.router.events.subscribe(event =>
      if (event instanceof NavigationStart)
         console.log(event.url)
         this.routerChangeMethod(event.url);
      
   )


routerChangeMethod(url)
  this.title = url;

Tu app.component.html es…

title


Como buena práctica, debe tener un componente por ruta.

RouterModule.forRoot([
     path: 'products', component: DetailComponent ,
     path: 'shopping-cart', component: SomelistComponent 
])

Si mantienes esta práctica, entonces tendrás una separación de intereses.

Y luego, de acuerdo con la ruta, acaba de establecer el encabezado para su componente.

Puede leer más sobre el enrutamiento aquí.

Si conservas alguna vacilación y forma de afinar nuestro sección puedes realizar una crítica y con gusto lo interpretaremos.

¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)



Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *