如何显示AngularFirestore数据 [英] How to display AngularFirestore data

查看:35
本文介绍了如何显示AngularFirestore数据的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在尝试显示我的Firestore数据库中的用户名和年龄,我没有收到任何错误,但没有任何显示.我在这里做错什么了?

I'm trying to display the username and age from my firestore database I get no errors but nothing is showing. What am I doing wrong here?

home.ts

import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams} from 'ionic-angular';
import { AngularFireAuth } from 'angularfire2/auth';
import { AngularFirestore} from 'angularfire2/firestore';
import { Profile } from './../../models/profile';


@IonicPage()
@Component({
  selector: 'page-home',
  templateUrl: 'home.html',
})
export class HomePage {

  profcollection: AngularFirestore<Profile>;

  constructor(private afs: AngularFirestore, private afAuth: AngularFireAuth, public navCtrl: NavController, public navParams: NavParams) {
  }

  ionViewWillLoad() {
    this.afAuth.authState.take(1).subscribe(data => {
      if (data && data.email && data.uid) {

        this.profcollection = this.afs.collection('profiles').doc(`${data.uid}`).valueChanges();

      }else{
        this.navCtrl.setRoot('LoginPage');
      }
    })
  }
}

home.html

<ion-content padding>
  <p>Username: {{profcollection.username}} </p>
  <p>Age: {{profcollection.age}} </p>
</ion-content>

推荐答案

尝试此代码

 profcollection: any;
 const profileDoc = afs.collection('profiles').doc(user.uid);
 profileDoc.valueChanges().subscribe((profile: any) => {
      this.profcollection = profile;
 });

这篇关于如何显示AngularFirestore数据的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆