如何根据所选选项从 Firebase 接收数据？

Question

我正在开发一个 ionic 2 应用程序，人们可以在其中将他们的血型添加到 firebase。

现在我想实现一个搜索页面来接收来自 firebase 的数据，例如，有人想搜索 B Rh+ 血型，只需选择该单选按钮，当他们点击搜索时，我想搜索 B Rh+ 血型Firebase 并列出它们。

这是我的搜索 html：

  <ion-list>
  <ion-item>
    <ion-label>Blood Type</ion-label>
    <ion-select [(ngModel)]="bloodtype">
      <ion-option value="ap">A Rh+</ion-option>
      <ion-option value="an">A Rh-</ion-option>
      <ion-option value="bp">B Rh+</ion-option>
      <ion-option value="bn">B Rh-</ion-option>
      <ion-option value="abp">AB Rh+</ion-option>
      <ion-option value="abn">AB Rh-</ion-option>
      <ion-option value="zp">0 Rh+</ion-option>
      <ion-option value="zn">0 Rh-</ion-option>
    </ion-select>
  </ion-item>

  <ion-item>
  <ion-range [(ngModel)]="range">
    <ion-icon range-left small name>0km</ion-icon>
    <ion-icon range-right small name>100km</ion-icon>
  </ion-range>
</ion-item>

<button ion-button full icon-left (click)="presentLoading()">
  <ion-icon name="search"></ion-icon>
  Search
</button>
</ion-list>

这是我的 search.ts：

import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { LoadingController } from 'ionic-angular';




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

  constructor(public navCtrl: NavController,public loadingCtrl: LoadingController) {}

  ionViewDidLoad() {
    console.log('Hello SearchPage Page');
  }

  presentLoading() {
    let loader = this.loadingCtrl.create({
      content: "Please wait...",
      duration: 3000
    });
    loader.present();
  }

}

我尝试使用搜索栏并通过此引用 this.bloodRef = firebase.database().ref('/bloods'); 接收数据，但使用搜索栏不起作用，因为人们可以输入“brh+”或“b”等。

我的 Firebase 层次结构：

---bloods (id)

          ------ blood-type: "B Rh+"

Answer 1

您可以使用 orderBy 和 equalTo 函数过滤项目：

var results = [];
this.bloodRef.orderByChild('blood-type').equalTo(this.bloodtype).once("value")
  .then(function(snapshot) {
    //snapshot.val() is the object
  });