infomofo / angular-md-pull-to-refresh

material pull to refresh

angular-md-pull-to-refresh

angular-md-pull-to-refresh gives you an angular directive that can be attached to a scrollable element (such as an md-content) and provides a pull-to-refresh functionality.

How do I use it

1. bower install infomofo/angular-md-pull-to-refresh

2. include the service in your angular module config

    var app = angular.module('YourApp',['infomofo.angularMdPullToRefresh']);
   

3. Use the directive in your html file.

    <md-content im-pull-to-refresh refresh-function="refreshFunction()">
   

See a demo

On a mobile device you can visit our gh-page to see a live demo of a pull-to-refresh gesture.

How do I affect the appearance

Currently the directive injects an md-progress-bar with the md-accent color. You can style the css of the progress-bar or the animation around by modifying the following classes, such as:

    .im-pull-to-refresh-progress-bar {
        max-height: 5px;
        opacity: 1;
    }

    .im-pull-to-refresh-progress-bar.ng-hide-add.ng-hide-add-active,
    .im-pull-to-refresh-progress-bar.ng-hide-remove.ng-hide-remove-active {
        -webkit-transition: all linear 0.25s;
        transition: all linear 0.25s;
    }

    .im-pull-to-refresh-progress-bar.ng-hide {
        max-height: 0;
        opacity: 0;
    }

angular-md-pull-to-refresh's Issues

How to show only circular progress and hide linear progress

With current options, it shows only linear progress, and its not showing circular progress to me. Can you please suggest how to show circular progress of material design.

add gh-pages

make template configurable?

Uncaugth TypeError: Cannot read property 'then' of undefined

Hello.

I am getting the error in this block.

if (!scope.pullToRefreshActive) {
   scope.pullToRefreshActive = true;
   scope.refreshFunction().then(function () {
       scope.pullToRefreshActive = false;
   });
   scope.$digest();
}

Really have no clue of what's going on because at runtime the scope object does have the function defined as:

function (locals) {
     return parentGet(scope, locals);
}

Thanks

remove dependency on angular-material?