1

Want to add more images from firebase when button clicked

I wrote a function,

onLoadMore() {
  if (this.all.length > 1 ) {
    const lastLoadedPost = _.last(this.all);
    const lastLoadedPostKey = lastLoadedPost.key;

    this.loadMoreRef = firebase.database().ref('allposts').startAt(lastLoadedPostKey, lastLoadedPost).limitToFirst(7);

    this.loadMoreRef.on('child_added', data => {

      if ( data.key === lastLoadedPostKey ) {
        return;
      } else {
        this.all.push({
          key: data.key,
          data: data.val()
        });
      }
    });
  }
  }

but when i click button console shows me this error,

Query.startAt failed: second argument was an invalid key = "[object Object]". Firebase keys must be non-empty strings and can't contain ".", "#", "$", "/", "[", or "]").

When a button click click i want add more images but i don't want to repeat existing images

Frank van Puffelen
  • 565,676
  • 79
  • 828
  • 807
Hasitha Chandula
  • 425
  • 4
  • 12

1 Answers1

0

To get the next page of items when you're ordering by key, you need to:

this.loadMoreRef = firebase.database().ref('allposts').orderByKey().startAt(lastLoadedPostKey).limitToFirst(7);

Note this post about the meaning of the second argument to startAt: Firebase orderByChild with startAt()'s second argument w/ pagination not ordering

Frank van Puffelen
  • 565,676
  • 79
  • 828
  • 807
  • If i want add them in desc order what should i do? – Hasitha Chandula May 12 '19 at 13:32
  • Firebase Realtime Database always returns items in descending order. To get them in descending order you will either have to reserve them client-side, or add a property with an inverted value to your data model. See https://stackoverflow.com/search?q=%5Bfirebase-realtime-database%5D+sort+descending – Frank van Puffelen May 12 '19 at 14:26