「await」式は非同期関数内でのみ許可されます

Question

以下のような非同期メソッドがあります。エラーが表示されます[ts] 'await' expression is only allowed within an async function. ここに await userProfile.set({。整理する方法を教えてください。

注：たぶんpromise内でobservableを呼び出そうとしたことが原因です。どんな手掛かり？

 async loginWithGoogle(): Promise<void> {
    const result = await this.afAuth.auth.signInWithPopup(new firebase.auth.GoogleAuthProvider());
    const userId: string = result.uid;
    const userProfile: AngularFirestoreDocument<UserProfile> = this.fireStore.doc(`userProfile/${userId}`);
    const userProfiles: AngularFirestoreCollection<UserProfile> = this.fireStore.collection('userProfile/', ref => ref.where('email', '==', result.email));
    const userProfiles$: Observable<UserProfile[]> = userProfiles.valueChanges();
    userProfiles$.subscribe(res => {
      if (res == null) {
        await userProfile.set({ //here it shows error
          id: userId,
          email: result.email,
          creationTime: moment().format(),
          lastSignInTime: moment().format()
        });
      }
    });
  }

Answer 1

メイン関数は非同期ですが、awaitとして宣言されていない矢印関数でasyncを使用しています

userProfiles$.subscribe(async res => {
  if (res == null) {
    await userProfile.set({
...