In this lecture, we are going to begin retrieving a roots data, as we learned earlier, the router
does not readily provide us with the data from the Root.
It's because our service is outside of the router outlet directive.
It is a gotcha.
We should be aware of.
For this entire lecture, we will be working inside the authentication service.
The solution to our problem is through the router throughout the lifetime of our app.
The router emits UV vents whenever the user navigates around the app.
Events can be emitted by the user's actions or when we force them to navigate.
During these events, we can access information about the current route.
We will solve our issue by listening to these events inside the constructor function.
We are going to subscribe to the this router events object.
Every time the router experiences changes, it'll emit events, believe it or not, there are dozens
of possible events that can be emitted from the router.
Let's pass in the console log function to check out the data we will receive from this event.
In the browser, refresh the page with the console opened.
Astonishingly, we will receive about a dozen events logged in the console.
There's not enough time to go over each event.
The main goal of this lecture is to redirect the user if they're on a page that requires authentication.
The navigation we care about is called navigation end.
This event gets emitted whenever the router is finished navigating to a route.
We don't want to check the router until the user has finished navigating to a page.
After this event has been emitted, we can attempt to retrieve the data related to the current route.
Let's give it a try.
Back in the ED, we are going to update the import statement for the angular root package.
We will include the navigation end class.
We are importing this class to help us check the event.
That can sound confusing.
It'll be easier to understand once we've written the code.
Just follow along with me.
Next, we are going to import an operator called Filter from the Orange Juice Operators package.
Back in the constructor function, we will change the pipe function before subscribing to the events
observable.
The events of survival will emit several events.
We're not interested in handling every single event.
Unfortunately, Angular does not provide a way to listen to a specific event since the events property
isn't observable.
We can use operators to help us listen to a specific event.
The filter operator can perform this action efficiently.
We can use this operator to perform a conditional check on a value pushed by and I'm survival if we're
not interested in the value.
The filter operator will not push the value onto the next operator.
Therefore, the subscriber will never receive the value inside the filter operator.
Let's pass in an error function that accepts the event object.
The function must return a Boolean value.
It does not need to return the event object itself.
The filter operator will pass on the value if we return a true value for the return value.
We will check if the event object is an instance of the navigation and class.
Filters are how we can listen to specific events on the router.
It's likely you'll need to use the filter operator whenever you're listening to events on the router.
Let's give our filter a test in the browser.
Refresh the page.
And the Council of the Developer Tools.
A single event will get log on every navigation.
The event should be the navigation and event.
All other events are ignored, which is what we want, despite not returning the event object from the
filter operator.
It was automatically passed on.
We successfully filtered the events.
We can move on to grabbing the data.
Let's begin capturing the data from a route in the next lecture.