Pull to Refresh

ion refresher

From http://ionicframework.com/docs/api/directive/ionRefresher/

<ion-content ng-controller="MyController">
  <ion-refresher
    pulling-text="Pull to refresh..."
    on-refresh="doRefresh()">
  </ion-refresher>
<ion-list>

index.html

<ion-content>      
  <ion-refresher
    pulling-text="Pull to refresh..."
    on-refresh="loadNewerStories()">
  </ion-refresher>      
  <div class="list">            
    <a class="item item-thumbnail-left" ng-repeat="story in stories track by story.id" href="{{story.url}" target="_blank">
      <img ng-src="{{story.thumbnail}}" ng-if="story.thumbnail.indexOf('http') === 0">
      <h2 class="story-title">{{story.title}}</h2>
      <p>
        <span am-time-ago="story.created_utc" am-preprocess="unix"></span>     
        -
        {{story.domain}}
      </p>
    </a>          
  </div>
  <ion-infinite-scroll
    on-infinite="loadOlderStories()"
    distance="1%">
  </ion-infinite-scroll>        
</ion-content>

app.js

(function(){

var app = angular.module('myreddit', ['ionic','angularMoment']);

app.controller('RedditCtrl',function($http,$scope){
  
  $scope.stories = [];

  function loadStories(params,callback){
    $http.get('https://www.reddit.com/r/funny/new/.json', {params: params})
      .success(function(response){
        var stories = [];
        angular.forEach(response.data.children,function(child){
          $scope.stories.push(child.data);
        });
        callback(stories);
      });    
  }

  $scope.loadOlderStories = function(){
    var params = {};
    if($scope.stories.length > 0){
      params['after'] = $scope.stories[$scope.stories.length - 1].name;
    }    
    loadStories(params,function(olderStories){
      $scope.stories = $scope.stories.concat(olderStories);
      $scope.$broadcast('scroll.infiniteScrollComplete');
    });
  };

  $scope.loadNewerStories = function(){
    var params = {'before': $scope.stories[0].name};  
    loadStories(params,function(olderStories){
      $scope.stories = $scope.stories.concat($scope.stories);
      $scope.$broadcast('scroll.infiniteScrollComplete');
    });
  };

});

Sum: Ionic components make this very easy.