0

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…

Julien B
  • 71
  • 5

1 Answers1

0

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

Yousef
  • 876
  • 6
  • 13
  • Thank you very much for your answer. I tried, and it “works”. But that’s far from efficient. The whole results are loaded each time I trigger a modification of pageSize (not only the 10 next). I think I need to search for another way of *adding* results. – Julien B Oct 03 '15 at 21:36
  • Makes sense, but that's not how ElasticUI itself works (it works with one "view"). You could add a collection layer on top of it which keeps the old items and adds the new ones as pagination info changes – Yousef Oct 04 '15 at 12:56