Example Demonstrating how to Render List of Orders in Angular Component from Firebase Realtime DB w/ Auth using AngularFire

app.component.html

<section>
  <ul *ngIf="orders$ | async"> <!-- The *ngIf will hide the whole list until the data has arrived-->
    <li *ngFor="let order of orders$ | async"> <!-- The *ngFor will loop over and create list items for the orders once the data has arrived-->
      {{order.packageName}}: {{order.packageDescription}}
    </li>
  </ul>
</section>

app.component.ts

import {Component, OnInit}   from '@angular/core';
import {Order, OrderService} from './order.service';
import {Observable}          from 'rxjs';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent implements OnInit {

  title = 'ng-fire-so-qtn';

  orders$: Observable<Order[]>; // property to hold the observable which will have your array of Orders

  constructor(public orderService: OrderService) { // inject the OrderService into the component
  }

  ngOnInit() {
    this.orders$ = this.orderService.getCurrentOrder();
    // When this component is initialised it will get the current orders
  }

}

order.service.ts

import {Injectable}        from '@angular/core';
import {EMPTY, Observable} from 'rxjs';

import {AngularFireAuth}     from '@angular/fire/auth';
import {switchMap}           from 'rxjs/operators';
import {AngularFireDatabase} from '@angular/fire/database';


@Injectable({
  providedIn: 'root'
})

export interface Order {
  // write interfaces for all of your objects and use them
  // when defining variables and function return types.
  packageName: string;
  packageSize: number;
  packageDescription: string;
  packageFrom: string;
  packageTo: string;
  deliveryDate: Date;
  receiverNumber: number;
  paymentOption: string;
  UID: string;
}

export class OrderService {

  constructor(private afAuth: AngularFireAuth, private afDatabase: AngularFireDatabase) {
  }

  getCurrentOrder(): Observable<Order[] | never> { // note the use of the interface: Order[], which means returning an array of Orders
    return this.afAuth.authState // authState is an observable
      .pipe( // use pipe
        switchMap((user) => { // switchMap gets authState and then lets you return a different observable
          // The following returns an observable call to the real-time database:
          return user ? this.afDatabase.list<Order>(`delivery-orders/${user.uid}`).valueChanges() // if the user is authenticated an observable with the Orders is returned
                      : EMPTY; // if the user is not authenticated an empty observable is returned
          // NOTE: this observable is not called until it is subscribed to in the template using the `async pipe`, see
          // `app.component.html` where it has `*ngFor="let order of orders$ | async"` <== this is what kicks off the request to the database
        })
      );
  }
}