Enable a ion-button after some time

Ionic Framework ionic-v3
1

On my page i’ve a button and i want that it’s disabled by default, but, after 30 seconds my page is open, this button become enabled

Someone can help me ? :slight_smile:

2

hello,
hhmm …I’m really interessed why you wanna do that?

Maybe this helps to solve this need https://www.learnrxjs.io/operators/creation/timer.html

Best regards, anna-liebt

3

My Ionic 3 app has a registration form that need to validate phone number, so i used Twilio apis to send sms with a code, on validation page i’ve a button to Resend code but i don’t want the user press too many times ! So i want to enable button only after some time…

I’ve found this : https://www.codingandclimbing.co.uk/blog/ionic-2-simple-countdown-timer but it’s for Ionic 2

Thanks for your link, i’ve to see if i can use it because they using rxjs 6.x instead i’m still using rxjs 5.5

Regards

4

Try this way

<button ion-button [disabled]="shouldDisable"></button>

In your .ts file

shouldDisable=true;
constructor(){
}
ionViewDidLoad() {
    setTimeout(x => {
      this.shouldDisable=false;
    }, 30000)//30 seconds
}

Hope this helps

5

Thanks! And to show counter on button label? :grin: