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

Question

I developing an ionic 2 app where people can add their blood types to firebase.

Now I want to implement a search-page to receive that data from firebase, For instance, somebody wants to search for B Rh+ blood type, simply selects that radio button and when they click search I want to search B Rh+ bloods in Firebase and list them.

here is my search 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>

and here is my 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();
  }

}

I tried to use search bar and receive data with this reference this.bloodRef = firebase.database().ref('/bloods'); but using search bar is not functional since people can type "brh+" or "b" etc.

my firebase hierarchy:

---bloods (id)

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

Answer 1

You can filter items with orderBy and equalTo functions:

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