簡體   English   中英

如果沒有輸入選擇,如何啟用/禁用Ionic> = 2警報按鈕

[英]How to enable/disable an Ionic >=2 alert button if there are no input selections

我有一個帶有單選按鈕選項的離子警報,並且想要禁用“確定”按鈕,直到用戶做出選擇。 非常類似於這篇文章 ,除了我想在警報本身的動作上做,並能夠更新按鈕“啟用”,所以我的設置將如下

  import { AlertController } from 'ionic-angular';

    export class MessageService {
      constructor(private alertCtrl: AlertController) {
      }

      presentAlert() {
        let alert = this.alertCtrl.create();

        alert.addInput({
          type: 'radio',
          label: 'Option 1',
          value: 'value1',
          checked : false
        });

        alert.addInput({
          type: 'radio',
          label: 'Option 2',
          value: 'value2',
          checked : false
        });

        alert.addButton('Cancel');
        alert.addButton({
          text: 'Ok',

          handler: data => {

          }
        });
        alert.present();
      }
    }

我希望ok按鈕最初被禁用,但是一旦用戶做出選擇就會啟用。 由於離子選擇也使用警報,因此能夠在那里使用相同的東西會很好。

這可能/有一個簡單的方法嗎?

在此先感謝您的幫助。

我可能會遲到但這對我有用。

var bool=true;

然后在addInput中

disable:bool

我不知道為什么我必須這樣做,但它確實有效。

試試這個。

presentPrompt() {
    let alert = this.alertCtrl.create({
      title: 'Cancel Prompt',
      inputs: [
        {
          type:'radio',
          label:'Cancel for reason 1',
          value:'Cancel for reason 1'
        },
        {
            type:'radio',
            label:'Cancel for reason 2',
            value:'Cancel for reason 2'
        }
      ],
      buttons: [
        {
          text: 'Cancel',
          role: 'cancel',
          handler: data => {}
        },
        {
          text: 'OK',
          handler: data => {            
            if (data) {
              console.log(data          
            } else {
              this.presentAlert();
            }
          }
        }
      ]
    });
    alert.present();
  }

  private presentAlert() {
    let alert = this.alertCtrl.create({
      title: 'Validation select',
      subTitle: 'Please select',
      buttons: [{
                text:'Ok',
                handler:data=>{
                  this.presentPrompt();
                }
              }]
    });
    alert.present();
  }

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM