adriancarriger / angularfire2-offline

🔌 A simple wrapper for AngularFire2 to read and write to Firebase while offline, even after a complete refresh.
https://angularfire2-offline.firebaseapp.com/
MIT License
207 stars 48 forks source link

Returning List only once using .take(1) results in error #47

Open JaneDawson opened 7 years ago

JaneDawson commented 7 years ago

When I return a Firebase List Object only once like this: return this.db.list('/items').take(1); I receive the following error in VS Studio Code:

[ts] The 'this' context of type 'AfoListObservable<any[]>' is not assignable to method's 'this' of type 'Observable<any[]>'. Types of property 'lift' are incompatible. Type '(operator: Operator<any[], R>) => Observable<any[]>' is not assignable to type '(operator: Operator<any[], R>) => Observable'. Type 'Observable<any[]>' is not assignable to type 'Observable'. Type 'any[]' is not assignable to type 'R'.

However, everything seems to compile fine.

Returning an object only once (return this.db.object('/items').take(1);) works fine. When I use AngularFire2 instead, returning a list only once like this works fine.

adriancarriger commented 7 years ago

Hi @JaneDawson, thanks for spotting this issue! It looks like the types aren't matching up correctly.

Workaround

As a quick workaround just change your list's type to use any when you're using take(1).

Before

groceries: AfoListObservable<any[]>;

After

groceries: any;

Help wanted

Obviously this is not an ideal solution so anyone interested in helping is welcome to make a PR!

JaneDawson commented 7 years ago

Hi @adriancarriger,

thanks for the workaround. However, I'm not sure how to implement it, properly.

Currently I have:

getAllOffersOnce(){
    return this.db.list('/active_offers/').take(1);
  }

This results in the error as posted above. And I still have the same error when doing as suggested:

export class OfferService {
list: any;

  constructor( public db: AngularFireOfflineDatabase ) { }

  getAllOffersOnce(){
    this.list = this.db.list('/active_offers/').take(1);
    return list;
  }
adriancarriger commented 7 years ago

Hi @JaneDawson, I made a quick demo (with code) to better explain the workaround.

Basically you can just use this for your getAllOffersOnce method:

getAllOffersOnce() {
  return (<any>this.afoDatabase.list('groceries')).take(1);
}

The <any> is what allows it to avoid the type checking.

Again, I'm hopeful that this workaround won't be required in the future.

JaneDawson commented 7 years ago

Hi @adriancarriger: Thank you for your patience and the further explanation. It's working like this.

adriancarriger commented 7 years ago

Awesome, glad to hear! 👍

Ross-Rawlins commented 7 years ago

I tried this exact code and my observable is still firing twice. has there been some changes?