How to create boolean function on Ionic

Ionic Framework ionic-v3
1

Hello guys,

I’m trying to implement two functions to one button.
For instance, I want to create one button which can turn on and off modal.

<button (click)="openModal()" ion-button>Modal On / Off</button>

What would be my typescript and how can I pass in boolean to this set up?

openModal() {
  const myModal = this.modal.create('ModalPage');
  myModal.present();
}

This current button will only open up modal… but I want to be able to turn it off once clicking on this button again.

Thanks,

2

Hi,

This simple function should answer your question,

https://github.com/Microsoft/TypeScript/issues/2983

Hope that helps,

1 Like
3

Or you could simply set the value type before declaration,

aka this,

// https://www.typescriptlang.org/docs/handbook/basic-types.html

openModal() {
  let myModal : boolean = true;
  const myModal = this.modal.create('ModalPage');
  myModal.present();
}

You can try this, not tested at my code,

Hope this helps,

Francoisdigico

1 Like
4

they didn’t really help… other opinions would be appreciated.

Thanks,

5

@jamesharvey after i think you can’t assign both a boolean declaration and a const, not sure, i’m not a super expert in TypeScript. Anyways dig into typescript because that’s what our code is about.

Good luck,

François

6

In your component:

  private boolean: isModalVisible = false;

  public toggleModal() {

    if (this.isModalVisible === false) {
      this.isModalVisible = true;
      // show Modal
    } else {
      this.isModalVisible = false;
      // hide Modal
    }
  }
1 Like
7

@robinyo @jamesharvey looks like the solution, thank you Robinyo :slight_smile:

1 Like
8

Will try that now.

Thanks a lot… I see why mine wasn’t working… I was using only two ==

9

so now it works @jamesharvey ?