Firebase入门求助：AngularFireStore获取登录用户数据

嘿，刚上手Firebase确实容易踩点小坑，我来帮你把这个用户数据获取的问题搞定～

你当前的代码里，this.afs.collection('Users').document(user.uid)只是拿到了对应文档的引用，还没转换成能被订阅的Observable数据流，所以没法直接赋值给userData。这里给你调整一下代码，分两种常见场景：

场景1：只需要文档里的字段数据 #

如果不需要文档ID，只需要文档内的字段，用valueChanges()就能直接拿到数据的Observable：

.then(user => {
  this.authState = user;
  // 注意AngularFire里的方法是doc()不是document()哦
  this.userData = this.afs.collection('Users').doc(user.uid).valueChanges();
})

场景2：需要包含文档ID（也就是用户uid）的数据 #

如果想把文档ID和字段数据一起拿到，就用snapshotChanges()配合RxJS的map操作符来处理：

// 记得先导入RxJS的map操作符
import { map } from 'rxjs/operators';

// 登录回调里的代码
.then(user => {
  this.authState = user;
  this.userData = this.afs.collection('Users').doc(user.uid).snapshotChanges().pipe(
    map(docSnapshot => {
      // 提取文档数据和ID
      const data = docSnapshot.payload.data() as any;
      const userId = docSnapshot.payload.id;
      // 合并成包含ID的对象
      return { userId, ...data };
    })
  );
})

额外注意事项 #

• 确保Firestore的Users集合里，确实存在以当前登录用户uid为ID的文档，不然userData会返回null
• 在组件模板里推荐用async管道来订阅这个Observable，它会自动帮你管理订阅和取消订阅，比如：

  <div *ngIf="userData | async as user">
    用户名：{{ user.username }}
    邮箱：{{ user.email }}
  </div>
  

内容的提问来源于stack exchange，提问作者Volodymyr Humeniuk