Ember Infinite List is very easy and flexible to use addon for pagination on scrolling.
- Ember.js v2.18 or above
- Ember CLI v2.13 or above
ember install infinite-list
It's very easy to use addon. You have flexibility to display and fetch data according to your will. You have to use this addon as a block component. It expects 3 things to be passed:
- Display logic
loadMore
action to trigger pagination on reaching bottom of the page.- height of the list (optional)
**template.hbs**:
{{#infinite-list height="75vh" loadMore=(action "loadMoreData") as |items| }}
<div class="list">
<ol>
{{#each items as |item|}}
<li>
<a>{{item.name}}</a>
</li>
{{/each}}
</ol>
</div>
{{/infinite-list}}
**controller.js**:
actions: {
loadMore() {
/**
return data on each pagination.
Example:
return this.store.query("user", {page: page});
**/
}
}
See the Contributing guide for details.
This project is licensed under the MIT License.