ngPullToRefresh

mgcrea.pullToRefresh is a module providing a simple css-only pull-to-refresh component leveraging native style momentum scrolling -webkit-overflow-scroll: touch.

The directive has a configurable built-in debounce system (400ms treshold by default) and can leverage angular $q promises.

Quick start

Install the module with bower

$ bower install angular-pull-to-refresh --save

Include the required libraries:

<link rel="stylesheet" href="bower_components/angular-pull-to-refresh/dist/angular-pull-to-refresh.min.css">
<script src="bower_components/angular-pull-to-refresh/dist/angular-pull-to-refresh.min.js"></script>

Inject the mgcrea.pullToRefresh module into your app:

angular.module('myApp', ['mgcrea.pullToRefresh']);

Examples

You can check out a working demo there (only works on touch devices):

http://plnkr.co/edit/C4dV0cvWxvrfR6y0uCxI?p=preview

<div class="content">
  <ul class="list-group list-group-table" pull-to-refresh="onReload()">
    <li class="list-group-item" ng-repeat="state in states" ng-bind="state"></li>
  </ul>
</div>

angular.module('myApp')

  .controller('AppCtrl', function($scope, $q) {

    $scope.states = ['Alabama', 'Alaska', 'Arizona', 'Arkansas', 'California', 'Colorado', 'Connecticut', 'Delaware', 'Florida', 'Georgia', 'Hawaii', 'Idaho', 'Illinois', 'Indiana', 'Iowa', 'Kansas', 'Kentucky', 'Louisiana', 'Maine', 'Maryland', 'Massachusetts', 'Michigan', 'Minnesota', 'Mississippi', 'Missouri', 'Montana', 'Nebraska', 'Nevada', 'New Hampshire', 'New Jersey', 'New Mexico', 'New York', 'North Dakota', 'North Carolina', 'Ohio', 'Oklahoma', 'Oregon', 'Pennsylvania', 'Rhode Island', 'South Carolina', 'South Dakota', 'Tennessee', 'Texas', 'Utah', 'Vermont', 'Virginia', 'Washington', 'West Virginia', 'Wisconsin', 'Wyoming'];

    $scope.onReload = function() {
      console.warn('reload');
      var deferred = $q.defer();
      setTimeout(function() {
        deferred.resolve(true);
      }, 1000);
      return deferred.promise;
    };

  });

Contributing

Please submit all pull requests the against master branch. If your unit test contains JavaScript patches or features, you should include relevant unit tests. Thanks!

Authors

Olivier Louvignes

Copyright and license