File

src/app/layout/header/profile-dropdown/profile-dropdown.component.ts

Implements

OnInit

Metadata

selector app-profile-dropdown
styleUrls profile-dropdown.component.scss
templateUrl ./profile-dropdown.component.html

Inputs

isAuthenticated

Type: boolean

totalCartItems

Type: number

Constructor

constructor(authService: AuthService)

Methods

ngOnInit
ngOnInit()
Returns: void
logout
logout()
Returns: void
import { Component, OnInit, Input } from '@angular/core';
import { AuthService } from '../../../core/services/auth.service';

@Component({
  selector: 'app-profile-dropdown',
  templateUrl: './profile-dropdown.component.html',
  styleUrls: ['./profile-dropdown.component.scss']
})
export class ProfileDropdownComponent implements OnInit {
  @Input() isAuthenticated: boolean;
  @Input() totalCartItems: number;

  constructor(
    private authService: AuthService
  ) { }

  ngOnInit() {
  }

  logout() {
    this.authService.logout().subscribe(
      data => console.log(data)
    );
  }

}
<ul class="nav navbar-nav navbar-right">
  <li class="dropdown" dropdown>
    <a href="#" class="dropdown-toggle" dropdownToggle>
      <i class="fa fa-user" aria-hidden="true"></i>
      <span class="caret"></span>
    </a>
    <ul class="dropdown-menu" dropdownMenu *ngIf="!isAuthenticated; else elseBlock">
      <li><a [routerLink]="['/auth']">Sign Up</a></li>
      <li role="separator" class="divider"></li>
      <li><a [routerLink]="['/auth', 'login']">Login</a></li>
    </ul>

    <ng-template #elseBlock>
      <ul class="dropdown-menu" dropdownMenu>
        <li><a routerLink="/user">My Profile</a></li>
        <li><a routerLink="/user/orders">My Orders</a></li>
        <li role="separator" class="divider"></li>
        <li><a routerLink="/user/addresses">Saved Addresses</a></li>
        <li role="separator" class="divider"></li>
        <li><a href="#">Edit Profile</a></li>
        <li><a (click)="logout()">Logout</a></li>
      </ul>
    </ng-template>
  </li>
  <li class="cart" [routerLink]="['checkout','cart']">
    <a>
      <i class="fa fa-shopping-bag" aria-hidden="true"></i> Bag
      <span class="badge badge-danger">{{totalCartItems}}</span></a>
  </li>
</ul>
Legend
Html element
Component
Html element with directive

results matching ""

    No results matching ""