Search icon CANCEL
Subscription
0
Cart icon
Your Cart (0 item)
Close icon
You have no products in your basket yet
Save more on your purchases now! discount-offer-chevron-icon
Savings automatically calculated. No voucher code required.
Arrow left icon
Explore Products
Best Sellers
New Releases
Books
Videos
Audiobooks
Learning Hub
Conferences
Free Learning
Arrow right icon
Arrow up icon
GO TO TOP
Angular for Enterprise Applications

You're reading from   Angular for Enterprise Applications Build scalable Angular apps using the minimalist Router-first architecture

Arrow left icon
Product type Paperback
Published in Jan 2024
Publisher Packt
ISBN-13 9781805127123
Length 592 pages
Edition 3rd Edition
Languages
Tools
Arrow right icon
Author (1):
Arrow left icon
Doguhan Uluca Doguhan Uluca
Author Profile Icon Doguhan Uluca
Doguhan Uluca
Arrow right icon
View More author details
Toc

Table of Contents (14) Chapters Close

Preface 1. Angular’s Architecture and Concepts FREE CHAPTER 2. Forms, Observables, Signals, and Subjects 3. Architecting an Enterprise App 4. Creating a Router-First Line-of-Business App 5. Designing Authentication and Authorization 6. Implementing Role-Based Navigation 7. Working with REST and GraphQL APIs 8. Recipes – Reusability, Forms, and Caching 9. Recipes – Master/Detail, Data Tables, and NgRx 10. Releasing to Production with CI/CD 11. Other Books You May Enjoy
12. Index
Appendix A

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.

  1. Test...
lock icon The rest of the chapter is locked
Register for a free Packt account to unlock a world of extra content!
A free Packt account unlocks extra newsletters, articles, discounted offers, and much more. Start advancing your knowledge today.
Unlock this book and the full library FREE for 7 days
Get unlimited access to 7000+ expert-authored eBooks and videos courses covering every tech area you can think of
Renews at $19.99/month. Cancel anytime