CODEWITHSUNDEEP
angularjsionic-v1
user1261710
user1261710

Reputation: 2639

How to hide ion-refresher using ng-if?

I'm writing an app with AngularJS 1.5.3 and Ionic 1.3.5.

I would like to hide the ion-refresher component if a certain condition is met:

<ion-refresher
  ng-if="data.state === 'main'"
  on-refresh="refresh()"
  spinner="lines"
  pulling-icon="ion-ios-arrow-down">
</ion-refresher>

Using ng-if is not working for me. I can still pull down to refresh even if the state is main.

What can I do to hide this feature?

Upvotes: 0

Views: 887

Answers (3)

Luther
Luther

Reputation: 280

for ionic 4 and above, set disabled prop on the ion-refresher component

<ion-refresher slot="fixed" (ionRefresh)="refreshPage($event)" disabled="true">
    <ion-refresher-content pullingIcon="lines" refreshingSpinner="lines"></ion-refresher-content>
</ion-refresher>

ref: https://ionicframework.com/docs/api/components/refresher/Refresher/

Upvotes: 1

Durgesh Ahire
Durgesh Ahire

Reputation: 117

Use enabled keyword instead of ng-if

If the refresher is enabled or not. This should be used in place of an ngIf. Default is true.

Upvotes: -1

Sujan Gainju
Sujan Gainju

Reputation: 4769

You should be using enabled attribute instead of *ngIf to display and hide the ion-refresher

<ion-refresher
  enabled = "false"
  on-refresh="refresh()"
  spinner="lines"
  pulling-icon="ion-ios-arrow-down">
</ion-refresher>

Upvotes: 0

Related Questions