如何从 firebase 和 Ionic 3 渲染特定数据

Question

目前我正在从事 Ionic 3 项目并拥有 firebase 数据库。我能够从表和用户中检索所有数据，以便在 HTML 中显示它们。但是在显示特定 id 和 where 条件的数据时没有运气。

这些查询是php mysqli查询作为参考 查询 = SELECT * FROM users - 工作得很好

query1 = SELECT * FROM users WHERE id = 'some id' - 不工作

query2 = SELECT * FROM users WHERE status = 1 - 不工作

这是我的用户提供者

我创建了一个渲染用户函数来检索所有用户数据，

renderUsers(): Observable<any> {

    return new Observable(observer => {
      let users: any = [];
      firebase.database().ref('users').orderByKey().once('value', (items: any) => {
        items.forEach((item) => {
          users.push({
            id: item.key,
            email: item.val().email,
            password: item.val().password,
            image: item.val().image,
          });
        });

        observer.next(users);
        observer.complete();
      },
        (error) => {
          console.log("Observer error: ", error);
          console.dir(error);
          observer.error(error)
        });

    });
  }

我的个人资料.ts

  loadAndParseUser() {
      this.user = this._DBUSER.renderUsers();
      console.log(this.user);
      this._LOADER.hidePreloader();
    }

profile.html

<ion-col col-12  *ngFor="let u of user | async">
          <h5>{{u.email}}</h5>

Answer 1

我不确定为什么您的 mySQL 查询会参与其中。但我假设你是用它来表达你真正想要的东西。因此，假设您非常习惯于查询数据的关系数据库也是安全的。但是在firebase中，它的工作方式不同。

我不确定您是如何准确构建数据库的，但我们假设您的结构看起来像这样。

 users
   e96a-4f66-b3d5-9c4c484316c1
     name: metalhead101
     score: 45
     status: 3
   a79c-4839-be70-6d683f3f4c50
     name: realappie
     score: 1226
     status: 2

其中fkaljf92kfja 和fafau292afjf 是您的用户标识符。或者在 firebase 的情况下，这些将是您的用户唯一 ID，您将在帐户创建或联合身份提供者登录回调中捕获这些 ID。有关更多信息，请参阅managing users。

要执行 SELECT * FROM users WHERE id = 'some id' 的等效操作，您可以这样做。

firebase.database().ref('users/' + id)

现在我们已经完成了简单的部分，让我们开始您的第二个查询。

SELECT * FROM users WHERE status = 1

为了能够过滤某个字段，您需要对数据进行非规范化处理。 firebase 团队的 blog post 很好地解释了这一点。但关键是我们希望以更多的写入为代价来优化我们的数据库以进行读取操作。因此，不要将状态存储在user 节点下。我们会将其存储在statuses 节点下。所以我们之前的结构最终看起来像这样

 users
   e96a-4f66-b3d5-9c4c484316c1
     name: metalhead101
     score: 45

   a79c-4839-be70-6d683f3f4c50
     name: realappie
     score: 1226

statuses
    2
        users: 
            :randomId
                a79c-4839-be70-6d683f3f4c50 // userId
    3
        users: 
            :randomId
                e96a-4f66-b3d5-9c4c484316c1 // userId

这将允许您像这样轻松查询状态值

firebase.database().ref('statuses/' + 1)

这将为您返回一个包含所有具有该状态的用户的对象。然后，您可以单独获取这些用户。

编辑：我认为@PeterHaddad 对第二个问题的解决方案不那么复杂，尽管我对非规范化的解释可能有助于在未来保持您的数据库快速读取。

另外请考虑使用angularfire 而不是创建自己的可观察对象。将 rxjs 集成在 firebase sdk 之上，这将使您的生活更加轻松。

Answer 2

要能够执行这两个查询：

查询1：

SELECT * FROM users WHERE id = 'some id' - not working

查询2：

SELECT * FROM users WHERE status = 1 - not working

你需要使用：

orderByChild("id").equalTo(idhere);

和

ordreByChild("status").equalTo("1");

更多信息在这里：

https://firebase.google.com/docs/database/web/lists-of-data#filtering_data

Answer 3

这样试试

public userData; // define as public variable.  
firebase
.database()
.ref(`person1/${id}`)
.on("value", (user) => {
    userData = user.val();
});

像这样在html中

 name : {{ userData.name }}<br>
    address : {{ {{ userData.name }}<br>
    ....other like this