Ion Refresh Native Directive

This directive ion-refresh-native extends the functionality of the ion-refresher or the Pull-To-Refresh component of the Ionic Framework. This has been tested with Ionic v3.

Installation

You can install the module from NPM using the following command.

npm i ion-refresh-native --save or npm install ion-refresh-native --save

Usage

Import the Directive to your app.module.ts. `typescript import { NgModule } from '@angular/core'; ... import { IonRefreshNativeModule } from 'ion-refresh-native';

@NgModule({ declarations: [ ... ], imports: [ ... IonRefreshNativeModule, ... ], bootstrap: [IonicApp], entryComponents: [], providers: [] }) export class AppModule {}

+ In your `app.scss` file, add the following:
```typescript
@import '../../node_modules/ion-refresh-native/dist/scss/ion-refresh-native';

Implementation

Now add the ion-refresh-native attribute in the ion-refresher component.

<ion-content>

  <ion-refresher ion-refresh-native (ionRefresh)="doRefresh($event)">
    <ion-refresher-content pullingIcon="ios-refresh-outline" refreshingSpinner="crescent"></ion-refresher-content>
  </ion-refresher>

</ion-content>

Inputs

ion-refresh-position (optional) Allows you to manually set the position of the icon when the refreshing state kicks off. Default is 55.

<ion-refresher ion-refresh-position="55" ion-refresh-native (ionRefresh)="doRefresh($event)"></ion-refresher>

Demo

See it live in action in this demo

Notes

This is still in early stage. If any of you wants to help improve this module, please do send PR's.

Package detail