Implementing infinite scroll with angular and elasticsearch via elastic ui

Question

Being both an AngularJS and Elasticsearch newbie, I’m currently working on a project where I should implement infinite scrolling on a frontend managed by ElasticUI (AngularJS Directives for Elasticsearch).

ElasticUI provides a pagination object (euiSimplePaging) that allows to load results on separate pages, but I’d like to load the new results on scroll and add them to the current ones.

I quickly set up ngInfiniteScroll, which works, but I don’t know where to start to link both apps. In a future step, I would even be able to listen to the results before showing them, as they should be displayed in a masonry-like grid.

If anybody had a clue on how to get started…

Answer 1

I have no experience with ngInfiniteScroll, but I would try the following:

infinite-scroll="indexVM.pageSize+=10"

to increase the pageSize of elasticui whenever ngInfiniteScroll requests more items