I have an Ionic page which is querying FirebaseListObservable to make dynamic searching on ion-searchbar. It works well with [email protected] and [email protected]. After upgrading new release AngularFire 5.0 I get an issue about FirabaseListObservable has no exported from new Api.
Then I changed the query with new api but I can not return response as an observable as you see below. Im getting error like this
**message: 'Type 'Observable[]>' is not assignable to type 'Observable'. Type 'AngularFireAction[]' is not assignable to type 'Response'. Property 'type' is missing in type 'AngularFireAction[]'.' **
import { Component } from '@angular/core';
import { IonicPage, NavParams, ViewController } from 'ionic-angular';
import {AngularFireDatabase, AngularFireAction} from 'angularfire2/database';
import { Observable, BehaviorSubject} from 'rxjs';
import { Response } from '@angular/http';
/**
* Generated class for the ModalGroupsPage page.
*
* See http://ionicframework.com/docs/components/#navigation for more info
* on Ionic pages and navigation.
*/
@IonicPage()
@Component({
selector: 'page-modal-groups',
templateUrl: 'modal-groups.html',
})
export class ModalGroupsPage {
items: Observable<AngularFireAction<firebase.database.DataSnapshot>[]>;
group: BehaviorSubject<any>;
constructor(public navParams: NavParams,
public viewCtrl:ViewController,
public afDatabase: AngularFireDatabase) {
}
getItems = (ev: any) : Observable<Response> => {
this.group = new BehaviorSubject(ev);
this.items = this.group.switchMap(name =>
this.afDatabase.list('/Groups', ref => name ? ref.orderByChild('namelower').startAt(ev.target.value).endAt(ev.target.value + '\uf8ff') : ref
).snapshotChanges());
return this.items;
}
In order to get Observable<Response>
from AngularFireList from 5.0 onwards,
use valueChanges()
function.
Check the change here.
return this.afDatabase.list('/Groups', {
query:{
orderByChild: 'namelower',
startAt: (ev.target.value),
endAt: (ev.target.value + '\uf8ff')
}
}
).valueChanges();
If you want to save an instance of this.afDatabase.list()
in this.groups
, it will be AngularFireList
instead of FirebaseListObservable
.