显示Firebase DB中的用户数据

时间:2018-05-10 15:52:44

标签: angular firebase firebase-realtime-database ionic3 angularfire2

我正在尝试将firebase用户中的两个集合与其唯一的用户ID匹配,并显示每个集合中的数据(如果它们存在于该集合中)。总共有6个不同的集合,我需要检查这些用户是否存在,如果他们这样做,我将需要显示他们的所有信息。 这是我的数据库的一些打印屏幕: these are the weight categories for fighters minus light heavyweight

this is the user collection where their initial details are located 我已将其更改为所有细节现在都位于同一个集合中

所以我尝试了一些尝试来做这件事。第一件事是,我没有将数据传递到不同的集合,而是尝试将其全部收集在一起,然后从那里获取信息,但我无法弄清楚如何为每个用户显示这些细节。我想我需要把它传递给一个数组,但不完全确定如何做到这一点,并且无法在互联网上找到任何东西来试图解决这个问题。我能够console.log所有用户详细信息,并且我能够成功地从firebase匹配用户UID获取这些详细信息但不完全确定如何显示该数据。

这是我的代码: 这就是我从firebase获取数据的方式,我只需要知道如何使用匹配的数据显示该集合中的所有用户。

ionViewDidLoad() {
    this.afAuth.authState.take(1).subscribe(data=>{
      var ref = firebase.database().ref().child(`users/${data.uid}`);
      if(ref != null){
        ref.on("value", function(snapshot) {

          console.log(snapshot.val());
        }, function (errorObject) {
          console.log("The read failed: " + errorObject.code);
        });

      }
      else(err)=>{
        console.log(err);
      }


    }
    )

这是我的一些HTML

<ion-item-sliding *ngFor="let key of filteredusers">
      <ion-item >
        <ion-avatar item-left>
          <img src="{{key.photoURL}}">
        </ion-avatar>
        <h2>{{key.displayName}}</h2> 
        <p>s</p> 
      </ion-item>

我能够获取他们的显示名称和他们的个人资料图片,但因为我在开始时遵循教程,所以这就是为什么我可以获得用户显示名称和照片URL但我不确定如何获得其余的的数据。 我对Ionic比较新,所以任何帮助都会受到赞赏。

我尝试添加类似的东西,但这仍然无效。

<h3>{{key.weight}}</
<h3>{{key.age}}</h3>

我从firebase获取数据的方式是这样的。

firedata = firebase.database().ref('/users');


  getallusers() {
    var promise = new Promise((resolve, reject) => {
      this.firedata.orderByChild('uid').once('value', (snapshot) => {
        let userdata = snapshot.val();
        let temparr = [];
        for (var key in userdata) {
          temparr.push(userdata[key]);
        }
        resolve(temparr);
      }).catch((err) => {
        reject(err);
      })
    })
    return promise;
  }

1 个答案:

答案 0 :(得分:0)

所以我想出了如何显示用户的重量和其他细节。 我刚刚在firebase中的同一个集合中传递了详细信息,而不是将它放在不同的集合中。然后我只是在HTML中调用了这些数据。

require(dirname(__DIR__) . "/bootstrap/autoload.php");

所以我添加了{{key.weight}},因为现在它们在同一个集合中,我可以在HTML中调用该数据。