Get next from JSON about infinite-ajax-scroll

[fieg]

Hi @altendorfme, you have to call this.append, from the nextHandler (from the final then call).

return this.append(Array.from(frag.childNodes))
        // indicate that there is a next page to load
        .then(() => hasNextPage);
    });

See this code for how to do this:
https://codesandbox.io/s/github/webcreate/infinite-ajax-scroll/tree/master/examples/json?file=/index.js

Please let me know if this helps.

[altendorfme]

Hi @fieg ,

There are two Ajax calls, the first is to bring the next URL:

[
  {
    "nextId": 2109671,
    "nextUri": "https://next.com/next-post/"
  }
]

The second call ias would take the information from the URL (nextUri), bringing the content.

I fork code, maybe it's easier in: https://codesandbox.io/s/romantic-cdn-yqurq

[fieg]

This is not a common use pattern for IAS. Why does the next url need to come from a json call? If you could tell me a bit more about your use case I can help you better.

[altendorfme]

Hi, this API route (With ElasticSearch) returns smarter related results.

[fieg]

I think this should do the trick:

function nextHandler(pageIndex) {
  return fetch("./static/post.json")
    .then((response) => {
      return response.json();
    })
    .then((data) => {
      let hasNextPage = pageIndex + 1 < data.length;
      let nextUrl = data[pageIndex].nextUri;

      return this.load(nextUrl).then((data) => {
        return this.append(data.items).then(() => {
          return hasNextPage;
        });
      });
    });
}

https://codesandbox.io/s/relaxed-feynman-ofl38?file=/index.js