Question

在ionic中，我想显示存储在Firestore中的用户电子邮件和位置，但是用户的Firestore文档ID是其电子邮件地址。我如何获取他们的数据并显示给他们

在authentication.ts中

import { Injectable } from "@angular/core";
import { AngularFirestore } from '@angular/fire/firestore';
import * as firebase from 'firebase/app';

@Injectable()
export class AuthenticationService {

  constructor(private firestore: AngularFirestore){}

  registerUser(value){

     firebase.auth().createUserWithEmailAndPassword(value.email, value.password)

     this.firestore.doc(`users/${value.email}`).set({
      Email: value.email
    })
  }


  userDetails(){
    return firebase.auth().currentUser;
  }
}

在display.page.html

<ion-header>
  <ion-toolbar>
    <ion-title>
      User Welcome
    </ion-title>

  </ion-toolbar>
</ion-header>

<ion-content padding>

<div *ngFor="let item of info>
      <h1>{{ item.Email }}</h1> 
    </div>

  <ion-button (click)="logout()">Log Out</ion-button>
</ion-content>

在display.page.ts 中，我已经给出了将电子邮件和位置添加到Firestore的代码，现在我想显示我正在做的数据

display.page.ts

ngOnInit(){

    this.authService.read().subscribe(data => {

      this.info = data.map(e => {
        return {
          Email: e.payload.doc.data()['Email'],
          Location: e.payload.doc.data()['Location'],
        };
      })
      console.log(this.info);
    });
}

在authentication.ts中

read() {
    return this.firestore.collection('users').snapshotChanges();
  }

问题在于它显示了所有文档数据

Answer 1

在您的服务中，您可以使用类似的方法来检索该用户的数据：

getUser(id: string) {
   return this.firestore.collection('users').doc(id).get();
}

然后，您在组件内调用此函数，就像传递密钥一样（在您的情况下为电子邮件）：

this.someService.getUser(email).then((value) => {
    console.log(value.data)
}

在离子应用程序中，我想将存储在Firebase Firestore中的数据显示给该应用程序

1 个答案: