Logout

The logout button on the application toolbar is already wired up to navigate to the logout component we created before. Let’s update this component so that it can log the user out when navigated to:

1. Implement the logout component:

   src/app/user/logout/logout.component.ts
   import { Component, OnInit } from '@angular/core' 
   import { Router } from '@angular/router'
   import { AuthService } from '../../auth/auth.service'
   @Component({
     selector: 'app-logout', 
     template: `<p>Logging out...</p>`,
   })
   export class LogoutComponent implements OnInit { 
     constructor(private router: Router, private authService: AuthService) {}
     ngOnInit() { 
       this.authService.logout(true)
       this.router.navigate(['/'])
     }
   }
   

   Note that we explicitly clear the JWT by passing in true to the logout function. After we call logout, we navigate the user back to the home page.

2. Test...