From the course: Building Applications with Angular, ASP.NET Core, and Entity Framework Core

Unlock the full course today

Join today to access over 22,700 courses taught by industry experts or purchase this course individually.

Logging out

Logging out

- [Instructor] In this video, we'll add a Logout button so we don't have to keep deleting our token from local storage in order to log out manually, and we'll also only show that logout button if they are already logged in. Let's begin by going over to our frontend project. Then let's go over to our auth.service.ts and create a logout function. We'll call localStorage.removeItem, and we'll remove 'token'. Let's close that and then open up our nav.component.ts. Let's add a new button by copying the login button on line 10, pasting it below, and calling it logout, and we'll get rid of the router link and instead we'll add a click binding, and we'll set it to auth.logout. We'll also need access to our AuthService inside our NavComponent now, so let's bring that in. Then let's inject it with a constructor. Now let's give it a try. Inside our browser, we can see we have our token, and if we hit Logout, we can see it's removed. Next, let's only display the logout button if we are currently…

Contents