Jako programista Frontend spotykasz się z sytuacją, w której musisz pokazać komponent tylko wtedy, gdy przechodzisz do pulpitu nawigacyjnego lub komponentu logowania. Dla reszty musisz się ukryć.

Jak zamierzasz zarządzać tym wszystkim w angular?

Cóż, Angular zapewnia różne zdarzenia i właściwości routera, których możesz użyć do śledzenia, na którym routerze aktualnie znajduje się użytkownik.

Omówimy zdarzenie NavigationEnd trasy Angular

Co to jest koniec nawigacji?

Zdarzenie wyzwalane, gdy nawigacja zakończy się pomyślnie.

Jak używać??

• Wewnątrz konstruktora subskrybujesz zdarzenia routera.
• Następnie sprawdzisz, czy subskrybowana wartość jest instancją Navigation End, czy nie.
• Jeśli tak, użyjesz tej subskrybowanej wartości i użyjesz value.url, aby znaleźć adres URL, pod którym aktualnie nawigował użytkownik, i umieścić w nim logikę.
• W końcu napiszesz swoją logikę zgodnie z value.url

Mój app.component.html wygląda tak

Tutaj możesz zobaczyć, że pokazuję nagłówek tylko wtedy, gdy właściwość „showHeader” jest prawdziwa

Mój plik app.component.ts wygląda tak

Teraz, jeśli kliknę przycisk przesyłania, zostanie przekierowany do „pulpitu nawigacyjnego”
i wyświetli komponent pulpitu nawigacyjnego.

* Dlatego komponent nagłówka staje się widoczny *

Działające repozytorium w celach informacyjnych
https://stackblitz.com/edit/angular-ivy-atods7?file=src/app/app.component.ts

Łącze Githuba
https://github.com/deepa314/angular-ivy-atods7.git

Mam nadzieję, że ci to pomoże :)
Jeśli ci się podoba, polub, udostępnij i zasubskrybuj