Question

到目前为止，ion-alert上的Ionic 4文档包含一个示例，该示例如何向警报中添加文本输入，如下所示：

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

但是我无法找到如何从name1文本输入（例如在按钮处理程序中）访问值的方法。

我是否必须使用类似document.getElementById的东西，还是有其他的离子/角度样式方式？

Answer 1

您可以在警报关闭时使用一个按钮来处理数据。

   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) => {
                console.log(alertData.name1);
            }
            }
          ]
  });
  await alert.present();

Answer 2

实际上，这可以简化为：

const alert = await this.alertController.create({
    header: 'Prompt!',
    inputs: [
        {
            name: 'input1',
            type: 'text',
            placeholder: 'Please enter text'
        }
    ],
    buttons: [
        {
            text: 'Cancel',
            role: 'cancel',
            cssClass: 'secondary',
            handler: () => {
                console.log('Confirm Cancel');
            }
        }, {
            text: 'Ok',
            handler: (alertData) => {
                console.log(alertData.input1);
            }
        }
    ]
});

尽管参数alertData仅包含输入及其值：

从Ionic 4警报的输入中获取价值

2 个答案: