### 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`
Defined in src/app/layout/header/profile-dropdown/profile-dropdown.component.ts:10

`totalCartItems` | Type: `number`
Defined in src/app/layout/header/profile-dropdown/profile-dropdown.component.ts:11

### Constructor

`constructor(authService: AuthService)`
Defined in src/app/layout/header/profile-dropdown/profile-dropdown.component.ts:11

### Methods

ngOnInit
`ngOnInit()`
Defined in src/app/layout/header/profile-dropdown/profile-dropdown.component.ts:17
Returns: `void`

logout
`logout()`
Defined in src/app/layout/header/profile-dropdown/profile-dropdown.component.ts:20
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 ""