如果出现错误，请保留警报框而不关闭

Posted 2021-03-30

这只是一个带单选按钮的警告框。除了一件事，一切正常。即如果出现错误，我将无法保留警报框，直到用户输入正确的数据。根据the doc我使用了return false功能。但还没有运气。任何线索？

Note:如果输入是text boxes，这工作正常。在这里，我需要单选按钮。

const allApiKeys = await this.apiKeySqliteProvider.getAllApiKeys();
            const alert = this.alertCtrl.create();
            alert.setTitle('Select Api Key');
            forEach(allApiKeys, (apiKey: ApiKey) => {
              alert.addInput({
                type: 'radio',
                label: apiKey.name,
                value: apiKey.key,
                checked: false
              });
            });
            alert.addButton({
              text: 'Cancel',
              role: 'cancel',
              handler: data => {
                this.loading.dismissLoader(loading);
              }
            });
            alert.addButton({
              text: 'OK',
              handler: data => {
                let navTransition = alert.dismiss();
                navTransition.then(() => {
                 if (data == null) {
                    this.showToastProvider.showErrorToast("Invalid API Key");
                    this.loading.dismissLoader(loading);
                    return false;
                  } 
                });
                return false;
              }
            });
            alert.present();
          } 

答案

return false不是实际问题。你在调用alert.dismiss，这就是问题所在。如果你不想隐藏警报，你应该在dismiss块中移动else代码。

请将您的代码更改为以下内容

 const allApiKeys = await this.apiKeySqliteProvider.getAllApiKeys();
                const alert = this.alertCtrl.create();
                alert.setTitle('Select Api Key');
                forEach(allApiKeys, (apiKey: ApiKey) => {
                  alert.addInput({
                    type: 'radio',
                    label: apiKey.name,
                    value: apiKey.key,
                    checked: false
                  });
                });
                alert.addButton({
                  text: 'Cancel',
                  role: 'cancel',
                  handler: data => {
                    this.loading.dismissLoader(loading);
                  }
                });
                alert.addButton({
                  text: 'OK',
                  handler: data => {
                      if (data == null) {
                        this.showToastProvider.showErrorToast("Invalid API Key");
                        this.loading.dismissLoader(loading);
                        return false;
                      }

                      // you don't need else here as by default it will hide alert
                  }
                });
                alert.present();
              }