'Ionic 4 ion-action-controller prevent auto close on button click

I am trying to show the list of language available as an Action sheet. But as soon as the language button is pressed the action sheet closes automatically. Is there any possible way to prevent the auto close of ion-action-sheet controller on clicking the ActionsheetButton.

async showChangeLangAlert() {
    const actionSheet = await this.actionSheet.create(
      {
        header: this.translateText('Select language'),
        buttons: this.getLanguageInputTypes(),
        cssClass: 'confirmation-popup select-lang',
        backdropDismiss: true,
        mode: 'md'
      }
    );

    actionSheet.present();

    actionSheet.onWillDismiss().then(res => {
      console.log(res);
      event.preventDefault();
    });

    actionSheet.onDidDismiss().then(res => {
      this.langChoosen.next(this.selectedLanguage);
    });
  }

private getLanguageInputTypes(): ActionSheetButton[] {
    if (this.selectedLanguage === undefined) {
      this.selectedLanguage = 'en';
    }
    return [
      {
        text: this.translateText('English'),
        icon: (this.selectedLanguage.toLowerCase() === 'en') ? 'radio-button-on' : 'radio-button-off',
        cssClass: (this.selectedLanguage.toLowerCase() === 'en') ? 'active-option' : '',
        handler: () => {
          this.selectedLanguage = 'en';
        }
      },
      {
        text: this.translateText('German'),
        icon: (this.selectedLanguage.toLowerCase() === 'de') ? 'radio-button-on' : 'radio-button-off',
        cssClass: (this.selectedLanguage.toLowerCase() === 'de') ? 'active-option' : '',
        handler: () => {
          this.selectedLanguage = 'de';
        }
      },
      {
        text: this.translateText('Select'),
        icon: 'checkmark-circle',
        cssClass: (this.selectedLanguage.toLowerCase() === 'de') ? 'active-option' : '',
        handler: () => {
          this.setSelectedLanguage();
        }
      }
        ];
      }

private setSelectedLanguage() {
 // close the action-sheet here
}

I want to achieve the manual close of the action-sheet controller, but it closes automatically on clicking any action button. What I am missing or is there any workaround to show the alert window as an action sheet?

ionic-framework ionic4

Solution 1:^[1]

the handler: ()=> returns to true after a button is clicked which dismisses the actionsheet. Returning false after the button is clicked in the handler() will keep the actionsheet in place.

handler: ()=>{
// assign selected language
this.selectedLanguage = 'en';

// then return false

return false;

}

Solution 2:^[2]

backdropDismiss Description If true, the action sheet will be dismissed when the backdrop is clicked.

Attribute backdrop-dismiss Type boolean Default true

backdropDismiss:false

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution	Source
Solution 1	Nana Yaw Amoako
Solution 2	Rohan Pawar

'Ionic 4 ion-action-controller prevent auto close on button click

Solution 1:[1]

Solution 2:[2]

Sources

Related Questions

Solution 1:^[1]

Solution 2:^[2]