0_route.js

import Ember from 'ember';

export default Ember.Route.extend({
  model: function() {
    return this.get('store').find('post'));
  },
  setupController: function(controller, model) {
    this._super.apply(this, arguments); // Do not forget this call

    controller.set('totalPages', model.get('meta.totalPages'));
  }
});

1_controller.js

import Ember from 'ember';

export default Ember.ArrayController.extend({
  // Are we currently fetching more data?
  loadingMore: false,

  // The current page (API-wise) we're on
  page: 1,

  // The total number of pages, filled first by the route
  // and later updated via the `loadMore` action
  totalPages: null,

  // Is there more data to load ?
  hasMore: (function() {
    return this.get('page') < this.get('totalPages');
  }).property('page', 'totalPages'),

  actions: {
    loadMore: function() {
      var _this = this;

      // We're fetching the next page of results
      var query = {
        page: this.get('page') + 1,
      };

      // We're starting to fetch data now
      this.set('loadingMore', true);

      this.get('store').find('post', query).then(function(data) {
        // We're done fetching data for the moment
        _this.set('loadingMore', false);

        // `data` is an Ember Data powered array-like.

        // We're merging its content with the models already fetched...
        _this.get('model').pushObjects(data.get('model'));

        // Note: in one project, I had to manually tell the controller that `model` had changed.
        // You should probably not have to this by yourself:
        // _this.notifyPropertyChange('model');
        
        // And we're updating the current page we're on
        // as well as the total page count (in case it changed).
        _this.incrementProperty('page');
        _this.set('totalPages', data.get('meta.totalPages'));
      }, function() {
        // We're done fetching data for the moment
        _this.set('loadingMore', false);

        // Additional error handling...
      });
    }
  }
});

2_template.hbs

{{!-- Our template goes here --}}

{{#if hasMore}}
  <button type="button" class="big-button" {{bind-attr disabled=loadingMore}} {{action "loadMore"}}>
    {{#if loadingMore}}
      Currently loading...
    {{else}}
      Load more
    {{/if}}
  </button>
{{/if}}