File

src/app/user/components/orders/orders.component.ts

Implements

OnInit

Metadata

selector app-orders
styleUrls orders.component.scss
templateUrl ./orders.component.html

Constructor

constructor(store: Store, userActions: UserActions)

Methods

ngOnInit
ngOnInit()
Returns: void

Properties

orders$
orders$: Observable<Order[]>
import { Component, OnInit } from '@angular/core';
import { Store } from '@ngrx/store';
import { AppState } from '../../../interfaces';
import { UserActions } from '../../actions/user.actions';
import { Observable } from 'rxjs/Observable';
import { Order } from '../../../core/models/order';
import { getUserOrders } from '../../reducers/selector';

@Component({
  selector: 'app-orders',
  templateUrl: './orders.component.html',
  styleUrls: ['./orders.component.scss']
})
export class OrdersComponent implements OnInit {
  orders$: Observable<Order[]>;

  constructor(
    private store: Store<AppState>,
    private userActions: UserActions
  ) {
    this.orders$ = this.store.select(getUserOrders);
  }

  ngOnInit() {
    this.store.dispatch(this.userActions.getUserOrders());
  }

}
<div *ngIf="(orders$ | async).length; else elseBlock">
  <div *ngFor="let order of orders$ | async">
    <app-order-list-item [order]="order"></app-order-list-item>
  </div>
</div>

<ng-template #elseBlock>
  <div class="cart-empty">
    <div class="empty-cart-icon"></div>
    <div class="empty-cart-message">You have'nt ordered anything yet.</div>
    <a class="empty-wishlist-link" routerLink="/home">Start Shopping</a>
  </div>
</ng-template>
Legend
Html element
Component
Html element with directive

results matching ""

    No results matching ""