我想将所有用户名从 firebase 数据库检索到我的 ionic 项目中

Question

这就是我的数据库的外观。我希望能够抓取当前在数据库中的所有名称，并在项目中以列表的形式显示它们。

Profile
  |
  |_ poTXrbBlRmZVCulutiHYBp3lj5D2
  |       |
  |       |_ Name :
  |       |
  |       |_ Email :
  |
  |_ hn3ds4hdsbBlRmpVCulutiHYBH3lj
  |       |
  |       |_ Name :
  |       |
  |       |_ Phone :

这是我的 home.ts 文件代码。我想在我的 .html 文件中显示用户列表作为输出

import { Component } from '@angular/core';
import { NavController, NavParams } from 'ionic-angular';
import { AngularFireAuth } from 'angularfire2/auth';
import { AngularFireDatabase } from 'angularfire2/database';

@Component({
  selector: 'page-main',
  templateUrl: 'main.html',
})
export class MainPage {

userId : string = "";


  constructor( public fire: AngularFireAuth, public navCtrl: NavController, 
  public db: AngularFireDatabase, public navParams: NavParams ) {
      this.userId = fire.auth.currentUser.uid;
  }

  ionViewDidLoad() {
    console.log('ionViewDidLoad MainPage');

  }

}

Answer 1

要获取名称列表，您可以提取保存在数据库中的整个对象列表，并将它们放入 .ts 文件中的数组中。

profiles:any = [];

this.db.list('Profile').valueChanges().take(1).subscribe(res => {

this.profiles = res;

});

使用数组，您可以引用与配置文件关联的名称并将它们显示在您的 .html 文件中。

<ion-list>
<ion-item *ngFor="let person of profiles">
{{person.Name}}
</ion-item>
</ion-list>