Cómo mostrar u ocultar el componente en función de la ruta en Angular.
Como desarrollador frontend, se encuentra con una situación en la que tiene que mostrar un componente solo si navega al panel de control o su componente de inicio de sesión. Para descansar, debe ocultar.
¿Cómo vas a manejar todo esto en angular?
Well Angular le proporciona varios eventos y propiedades del enrutador que puede usar para rastrear en qué enrutador se encuentra actualmente el usuario.
Estaremos discutiendo el evento NavigationEnd de la ruta Angular
¿Qué es el fin de navegación?
Un evento que se desencadena cuando una navegación finaliza correctamente.
¿¿Cómo utilizar??

- Dentro del constructor, te suscribes a los eventos del enrutador.
- Luego verificará que el valor suscrito sea una instancia de Fin de navegación o no.
- En caso afirmativo, usará ese valor suscrito y usará value.url para encontrar la URL donde el usuario ha navegado actualmente y colocar la lógica dentro.
- Por fin, escribirá su lógica de acuerdo con value.url
Mi app.component.html se ve así

Aquí puede ver que estoy mostrando el encabezado solo si la propiedad "showHeader" es verdadera
Mi app.component.ts se ve así

Ahora, si hago clic en el botón Enviar, se dirigirá al 'tablero'
y mostrará el componente del tablero.

* Por lo tanto, el componente de encabezado se vuelve visible *

El repositorio de trabajo para referencia
https://stackblitz.com/edit/angular-ivy-atods7?file=src/app/app.component.ts
Enlace GitHub
https://github.com/deepa314/angular-ivy-atods7.git
Espero que les ayude :)
Si les gusta, por favor, compartan y suscríbanse.