1

Expected behavior

Getting from the firestore a nested collection orderBy('seqNo', sortOrder)

Actual behavior

I can easily fetch the data if I do:

getAll(collectioName: string) {
        const response: AngularFirestoreCollection<ID> = this.db.collection(collectioName);

        return response.snapshotChanges()
            .pipe(
                map(snaps => snapsCoverter(snaps))
            )
    }

but as soon as I do:

 getCollectionPaginated(collectioName: string, sortOrder: OrderByDirection, pagesize: number, pageNumber: number) {
        const response: AngularFirestoreCollection<ID> = this.db.collection(
            collectioName,
            ref => ref
                .orderBy('seqNo', sortOrder)
                .limit(pagesize)
                .startAfter(pageNumber * pagesize)
        );

        return response.snapshotChanges()
            .pipe(
                map(snaps => snapsCoverter(snaps))
            )
    }

It returns an []

here's I invoke the method:

this.service.getCollectionPaginated(`courses/${id}/${nestedCollectionPath}`, "asc", 3, 0)
        .subscribe(x => console.log(x))

Information about the Issue

I am sure as hell the problem is here:

ref => ref
.orderBy('seqNo', sortOrder)
.limit(pagesize)
.startAfter(pageNumber * pagesize)

It works fine as long as I try to apply this logic to the main collection but it does't work on a nested one.

Could you please have a look?

Many Thanks.

Valerio Risuleo
  • 11
  • 2

2 Answers2

0

startAfter doesn't take an integer page number. In fact, Firestore paging doesn't use page numbers at all. In order to get another page of results, you have to first perform a limit query to get the first page, then pass a document reference or some other piece of identifying information about the last document from the first page to get the second page.

I suggest reading:

A web search will find other examples.

You might also want to read the formal Firestore documentation on pagination. While the Angular APIs are slightly different, the concepts are exactly the same.

Doug Stevenson
  • 297,357
  • 32
  • 422
  • 441
  • Hi @Doug, First allow me to thank you for your answer! :) Second pls accept my apologies because I should have been more specific: the problem is not `startAfter` but every query. In fact if we simply do `const response: AngularFirestoreCollection = this.db.collection( collectioName, ref => ref .orderBy('seqNo', sortOrder)` this will still return an `[]`. If you would like to test it by yourself I'll gladly make a repo for you. Many Thanks! – Valerio Risuleo May 24 '20 at 13:10
0

I Just made it work!

Longo story short the problem was in the way I was creating the relation: instead of loopinn trough an array of obj and store on the db each single obj inside the nested path, I was passing directly an [{},{},{}] and that's the reason why it was return an [] every time I was trying to make a db query such as orderBy, where, etc.

Now it works just fine and the pagination is awesome!

 getCollectionPaginated(collectioName: string, sortOrder: OrderByDirection, pagesize: number, pageNumber: number) {
        const response: AngularFirestoreCollection<ID> = this.db.collection(
            collectioName,
            ref => ref
                .orderBy('seqNo', sortOrder)
                .limit(pagesize)
                .startAfter(pageNumber * pagesize)
        );

        return response.snapshotChanges()
            .pipe(
                map(snaps => snapsCoverter(snaps))
            )
    }

Many Thanks!

Valerio Risuleo
  • 11
  • 2