ember-simple-infinite-scroller v1.0.12

ember-simple-infinite-scroller

This Ember addon provides a simple component that fires an action whenever it is scrolled to the bottom. Allowing you to load more data. It is not coupled to Ember-Data like some other infinite scrolling implementations.

Installation

ember install ember-simple-infinite-scroller

Example usage

{{#infinite-scroller on-load-more=(action 'loadMore') as |scroller|}}
  {{#each things as |thing|}}
    ...
  {{/each}}
  {{if scroller.isLoading 'Please wait...'}}
{{/infinite-scroller}}

Demo

Configuration

Element vs Document scroll

Either make your component scrollable:

.my-element {
  max-height: 300px;
  overflow-y: auto;
}

OR

Set use-document=true if your component is not scrollable.

{{#infinite-scroller use-document=true}}
  {{! action will fire when the document is scrolled to the bottom }}
{{/infinite-scroller}}

Yielded API

The component will yield a hash that provides:

Performance

Please read: https://github.com/TryGhost/Ghost/issues/7934

You may need to add this to app/app.js

customEvents: {
  touchstart: null,
  touchmove: null,
  touchend: null,
  touchcancel: null
}