Detecting empty data in Angular/RxJS infinite scroll: Best approach? about query HOT 4 CLOSED

Start a new pull request in StackBlitz Codeflow.

• stackblitz-starters-kuxqvm (Open reproduction)

from query.

I think putting @empty on the inner @for loop would have the desired output.
You push { data: [], nextId: null, previousId: null } which in turn signals tanstack query, that there is only this one page (no prev. page and no next page), hence the one result you get.

...
@for (page of result.data.pages; track $index) {
        @for (post of page.data; track $index) {
...

The outer for loop carries the pages it has fetched so far and accordingly re-renders them too. The inner one is for rendering their contents, thus why i said that placing an @empty block would probably give you the desired result.

from query.

but what if i don't have @empty? unfortunately i don't use control flow in my angular syntax.

from query.

then check the length property inside the first for loop

from query.