Get value from input in Ionic 4 alert

Andi picture Andi · Apr 5, 2019 · Viewed 12k times · Source

As of today the Ionic 4 documentation on ion-alert contains an example how to add a text input to an alert, like this:

const alert = await this.alertController.create({
  inputs: [
    {
      name: 'name1',
      type: 'text'
    },

But I can not find out how to access the value from the name1 text input, for example in the button handlers.

Do I have to use something like document.getElementById or is there a more Ionic/Angular-style way?

Answer

Ira J Watt picture Ira J Watt · Apr 5, 2019

you can have a button that on the close of the alert can handle the data.

   const alert = await this.alertController.create({
      inputs: [
        {
          name: 'name1',
          type: 'text'
        }],    
       buttons: [
            {
              text: 'Cancel',
              role: 'cancel',
              cssClass: 'secondary',
              handler: () => {
                console.log('Confirm Cancel');
              }
            }, {
              text: 'Ok',
              handler: (alertData) => { //takes the data 
                console.log(alertData.name1);
            }
            }
          ]
  });
  await alert.present();