src/app/layout/navbar/navbar.component.ts
| selector | app-navbar |
| styleUrls | ./navbar.component.css |
| templateUrl | ./navbar.component.html |
Properties |
Methods |
constructor(router: Router, authenticationService: AuthenticationService)
|
|||||||||
|
Defined in src/app/layout/navbar/navbar.component.ts:11
|
|||||||||
|
Parameters :
|
| logout |
logout()
|
|
Defined in src/app/layout/navbar/navbar.component.ts:19
|
|
Returns :
void
|
| ngOnInit |
ngOnInit()
|
|
Defined in src/app/layout/navbar/navbar.component.ts:15
|
|
Returns :
void
|
| username |
Type : string
|
|
Defined in src/app/layout/navbar/navbar.component.ts:11
|
import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';
import { AuthenticationService } from 'src/app/services/authentication.service';
@Component({
selector: 'app-navbar',
templateUrl: './navbar.component.html',
styleUrls: ['./navbar.component.css']
})
export class NavbarComponent implements OnInit {
username: string;
constructor(private router: Router, private authenticationService: AuthenticationService) { }
ngOnInit(): void {
this.username = JSON.parse(localStorage.getItem('currentUser')).username;
}
logout() {
this.authenticationService.logout();
this.router.navigate(['/login']);
}
}
<nav class="topnav navbar navbar-expand shadow navbar-light bg-white" id="sidenavAccordion">
<a class="navbar-brand d-none d-sm-block" routerLink="/dashboard">WorkFlow</a>
<ul class="navbar-nav align-items-center ml-auto">
<li class="nav-item dropdown no-caret mr-3 dropdown-user">
<a class="btn btn-icon btn-transparent-dark dropdown-toggle" id="navbarDropdownUserImage" href="javascript:void(0);" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><img class="img-fluid" src="../../assets/img/default-avatar.png"/></a>
<div class="dropdown-menu dropdown-menu-right border-0 shadow animated--fade-in-up" aria-labelledby="navbarDropdownUserImage">
<h6 class="dropdown-header d-flex align-items-center">
<div class="dropdown-user-details">
<div class="dropdown-user-details-name">{{ username }}</div>
</div>
</h6>
<div class="dropdown-divider"></div>
<a class="dropdown-item" routerLink="/user-profile">
<div class="dropdown-item-icon"><i class="fas fa-cog"></i></div>
Account
</a>
<a class="dropdown-item" (click)="logout()">
<div class="dropdown-item-icon">
<i class="fas fa-sign-out-alt"></i>
</div>
Logout
</a>
</div>
</li>
</ul>
</nav>
./navbar.component.css