Programmatically pull-down ion-refresher panel

hi… first of all… beautiful framework… really… and looking at the source code of ionic directives has taught me so much already… great work guys…

my question is is there a way to trigger ion-refresher panel to pull-down itself? the API to force it to pull-up exists… $scope.$broadcast('scroll.refreshComplete')… i couldnt find something similar to force it to drop-down as well…

the reason why i need this is… my app has a side-bar… you can open the first item in the content pane and pull-down to start a request… the request can take time… but i dont wanna block the user with a loader… so the UI is still responsive and he can go to some other item… but if he comes back to the first item and the request is still in process, i want the ion-refresher to be rendered in a pulled-down state…



1 Like

Wondering about exactly the same…

Here is a workaround I just found:

A offical way to get this done would be nice.
Or is there a other correct way to handle this use case?

Got exactly the same question. I found a way by applying css:

  1. define an id for you ion-refresher

    <ion-refresher id=‘profile-refresher’…

  2. add an ng-class to your ion-content

    <ion-content ng-class=“initialLoading?‘profile-content’:’’”

  3. define a css rule

    transform: translate3d(0px, 60px, 0px);

  4. add those lines to your controller

    // Show refreshin on startup
    var d = document.getElementById(“profile-refresher”);
    d.className = d.className.replace( /(?:^|\s)invisible(?!\S)/g , ‘’ )
    d.className += " active refreshing ";


=> obviously, remove the setTimeout for a function that you’ll call on page load and fetch your data.

Hope this helps