get-coffee-orders-resolver.service.ts

import { Injectable } from '@angular/core';
import {
  Resolve,
  ActivatedRouteSnapshot,
  RouterStateSnapshot,
} from '@angular/router';
import { Observable } from 'rxjs';
import { CoffeeOrder, OrdersService } from './shared/orders.service';

@Injectable({
  providedIn: 'root',
})
export class GetCoffeeOrdersResolverService implements Resolve<CoffeeOrder[]> {
  constructor(private ordersService: OrdersService) {}

  resolve(
    route: ActivatedRouteSnapshot,
    state: RouterStateSnapshot
  ): Observable<CoffeeOrder[]> | any {
    console.log('GetCoffeeOrdersResolver');

    // this.ordersService.getCoffeeOrders().subscribe((res) => {
    //   console.log(res);
    // });

    return this.ordersService.getCoffeeOrders();
  }
}

order-list.component.ts

import { Component, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
@Component({
  selector: 'app-order-list',
  templateUrl: './order-list.component.html',
  styleUrls: ['./order-list.component.css'],
})
export class OrderListComponent implements OnInit {
  coffeeOrders;
  res;
  constructor(private route: ActivatedRoute) {}

  ngOnInit() {
    console.log('ngOnInit');
    this.route.data.subscribe(res => {
      console.log(res);
      this.res = res;
    })
  }
}

orders.service.ts

import { HttpClient } from '@angular/common/http';
import { Injectable } from '@angular/core';
import { AngularFirestore } from '@angular/fire/firestore';

export class CoffeeOrder {
  coffeeOrder: string[];
  completed: boolean;
  customerName: string;
  orderNumber: number;
}
@Injectable({
  providedIn: 'root',
})
export class OrdersService {
  constructor(private firestore: AngularFirestore, private http: HttpClient) {}
  // getCoffeeOrders() {
  //   return this.firestore.collection('coffeeOrders').snapshotChanges();
  // }
  getCoffeeOrders() {
    console.log('OrdersService')

    let request = this.http.get('http://date.jsontest.com/');
    // request.toPromise().then(res => console.log(res))
    return request;

    // let orders = this.firestore
    //   .collection<CoffeeOrder>('coffeeOrders')
    //   .valueChanges();
    // // console.log(orders);
    // return orders;
  }
}