Firebase:如何将用户从firebase.auth().onAuthStateChanged异步绑定到Angular模板？

import { Component, OnInit } from '@angular/core';
import { AngularFireAuth } from '@angular/fire/auth';
import { Observable } from 'rxjs';

@Component({
  selector: 'app-your-component',
  templateUrl: './your-component.component.html',
  styleUrls: ['./your-component.component.css']
})
export class YourComponent implements OnInit {
  user: Observable<firebase.User>;

  constructor(private afAuth: AngularFireAuth) { }

  ngOnInit() {
    this.user = this.afAuth.authState;
  }
}

<div *ngIf="(user | async) as user">
  <p>Welcome, {{ user.displayName }}!</p>
  <p>Email: {{ user.email }}</p>
</div>
<div *ngIf="!(user | async)">
  <p>Please sign in.</p>
</div>