I'm trying to inplement filtering in the data that was retrieved from the firebase. As a newbie in Ng2 and Ionic I'm facing a troubles that connected with the speed of a search query. I got thouthands of records that keep the word and it's synonym. The goal is to make live searching similar to Ionic searchbar docs example and filter the synonyms. Since the example shows how to implement filtering on static data I've tried make my code deal with the firebase queries.
Data model that I have on the Firebase
The way I'm retrieving the data is pretty standart, but there are a lot of data that I have to reduce ititial query to 20 items.
I think that pagination is not so necessary, but search query takes minutes! and seems like I can't do anything rather changing data model and nest synonyms inside the as one object related to the word and not thouthands of relations word -> synonym.
The code is pretty standart Angular2 component with AngularFire included
import { Component } from '@angular/core';
import {AngularFire, FirebaseListObservable} from 'angularfire2';
import { NavController } from 'ionic-angular';
@Component({
selector: 'page-home',
templateUrl: 'home.html'
})
export class HomePage {
public afService:any;
items: FirebaseListObservable<any[]>;
constructor(public navCtrl: NavController, af: AngularFire) {
this.afService = af;
this.items = this.initItems(50);
}
// I'm not using provider for now
initItems(qty, serchQuery="guttenavan") {
return this.afService.database.list('/', {
query: {
limitToFirst: qty,
orderByChild: 'word', // Search field
equalTo: serchQuery
}
})
}
getItems(ev) {
this.initItems(50);
var val = ev.target.value;
if (val && val.trim() != '') {
this.items = this.initItems(9999, val.toLowerCase());
console.log(val.toLowerCase());
}
}
}
I'll be very glad to hear any suggestions about why it's extremely slow and how I can fix it. I'll be also glad to get some valuable information about pagination/infinite scroll with firebase and ionic. Thank You.