Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Firebase 5 Angular 5 AngularFireList.snapshotChanges() error

When I try to subscribe an AngularFireList in Angular 5/Firebase5 application giving the following error.

zone.js:192 Uncaught TypeError: Object(...) is not a function
    at SwitchMapSubscriber.eval [as project] (changes.js:7)
    at SwitchMapSubscriber._next (switchMap.js:91)
    at SwitchMapSubscriber.Subscriber.next (Subscriber.js:95)
    at RefCountSubscriber.Subscriber._next (Subscriber.js:131)
    at RefCountSubscriber.Subscriber.next (Subscriber.js:95)
    at Subject.next (Subject.js:56)
    at ConnectableSubscriber.Subscriber._next (Subscriber.js:131)
    at ConnectableSubscriber.Subscriber.next (Subscriber.js:95)
    at Notification.observe (Notification.js:32)
    at AsyncAction.DelaySubscriber.dispatch (delay.js:91)

My Service and Controller class content as follows,

1) Service named 'FirebaseService'

customers: AngularFireList<any>;
getCustomers(){
    this.customers = this.fire.list('users');
    return this.customers;
  }

2) Controller

constructor(private firebase: FirebaseService) { }

serviceProviders: ServiceProvider[];
var x = this.firebase.getServiceProviders();
    x.snapshotChanges().subscribe(item => {
      this.serviceProviders = [];      
      item.forEach(element => {
        var y = element.payload.toJSON();
        y["$key"] = element.key;
        this.serviceProviders.push(y as ServiceProvider);
      });
    });
like image 476
Lakshan Thilakarathne Avatar asked Dec 17 '22 23:12

Lakshan Thilakarathne


2 Answers

Recent releases of AngularFire require rxjs 6. Please upgrade rxjs and include rxjs-compat if you have dependencies that haven't upgraded.

like image 122
James Daniels Avatar answered Jan 04 '23 23:01

James Daniels


I had a similar problem while using AngularFireList.valueChanges() there is an npm warning when you install recent release of AngularFire (5.0.0-rc.10)

npm WARN [email protected] requires a peer of rxjs@^6.0.0 but none is installed

so I have installed that dependency

npm install rxjs@^6.0.0 --save in my project

It is also necessary to install the following dependency.

npm install --save rxjs-compat

and the problem is solved

like image 37
fzkhan Avatar answered Jan 04 '23 22:01

fzkhan