Angular: дождитесь данных в сервисе

Question

У меня есть служба в моем приложении Angular, где я извлекаю данные из Firebase из конструктора и присваиваю их переменной.

  // AuthService

  public user;

  constructor(
    private fireStore: AngularFirestore,
    public fireAuth: AngularFireAuth,
  ) {
    this.fireAuth.authState.subscribe(user => {
      this.user = user;
    })
  }

А потом я использую его в шаблоне компонента:

// Component html

<div>{{authService.user?.firstName}}</div>

Работает, но когда страница загружена, div пуст и получает данные только через 1 секунду.

Как я могу исправить эту проблему и сделать так, чтобы данные пришли мгновенно?