This course has been updated! We now recommend you take the Angular 13 Fundamentals course.
Transcript from the "Router Service" Lesson
[00:00:00]
>> So let's do one more thing here and I'm gonna show you how to navigate to a route using the router service. So occasionally, you need to perform maybe some sort of business logic in, you don't want to just attach the route to an anchor tag and do that.
[00:00:23] So how do you dynamically or using the router service route to a particular route versus having to actually click on an anchor tag? So if we go back to our app component and, Let's go to this login button here and on the login button, I'm just going to attach a click handler.
[00:00:53] And we're just going to say logout, okay? So we've created this click handler, attached the logout. A logout does not exist on this app component just yet, so we'll go logout. And from here, this is where we're going to use the router service to navigate to a URL.
[00:01:21] So what we need to do is we need to import the router service, so we'll go router And it would help if I could spell that, there we go. So router from Angular router and so now this is available to us. And then we can go this.router.navigateByUrl. And from here, we'll just go login.
[00:02:03] We'll just put a forward slash in here just to be a little bit more precise. And so if we go back into our application, we'll go to Courses. And then if I click on this, you'll notice now that we're being redirected to login so we could definitely expand on this functionality.
[00:02:23] But more importantly, is that here, we've kind of stubbed out our login route. And then now using this logout button, we're triggering the logout method in our application component. And then we're just calling this.router.navigateByUrl, and then we're redirecting it to login. And so this is kind of the core piece of Angular routing.
[00:02:55] And when I think of fundamentals, this is typically what I use, I would say 95% of the time.