Ionic Ion-refresher


Ionic Ion-refresher : Ion-refresher is used to pull-to-refresh to scroll view. It basically puts the content before the ionicContent or ionicScroll element. Here we are going to explain this with ionicScroll and ionContent element example and demo.


Ionic Ion-refresher

Here is an example of Ion-refresher-

Ion-refresher Javascript Part

Ionic Ion-refresher example

angular.module('myApp', ['ionic'])
.controller('MyCtr', function($scope, $http) {
  $scope.items = ["Php"];
  $scope.refreshNow = function() {
    $http.get('/fresh-items')
     .success(function(freshItems) {
       $scope.items = freshItems;
     })
     .finally(function() {
       $scope.$broadcast('scroll.refreshComplete');
     });
  };
});

Try it »

Ionic Ion-refresher Scroll example

Ion-refresher Html Part

Ion-refresher Html Example

<ion-content ng-controller="MyCtr">
<ion-refresher  pulling-text="Refresh..."  on-refresh="refreshNow();">
</ion-refresher>

<ion-scroll>
<ion-list>
    <ion-item ng-repeat="item in items">{{item}}</ion-item>  
</ion-list>
</ion-scroll>
</ion-content>

Try it »


Advertisements

Add Comment

📖 Read More