I have a problem with my Action Sheet in combination with (press)-event in a Ionic4 Application.
My code
HTML (Press-Event)
<ion-item *ngFor="let book of bibleBooks | calculateProcess: selectedBookType; let i = index"
(tap)="selectBibleBook(book); selectedItem=i;scrollVersesToTop(); setCurrentBook(i)"
(press)="openBookFunctions(book, selectedBookType, $event)"
[style.touch-action]="'pan-y'"
[class.active]="selectedItem == i"
[class.currentBook]="i == currentBook"
>
Component (Action Sheet)
const actionSheet = await this.actionSheetController.create({
header: this.tFunctions,
backdropDismiss: false,
buttons: [
{
text: this.tMarkAsRead,
icon: 'checkmark',
handler: () => {
this.markBookAsRead(book, selectedBookType)
}
},
{
text: this.tMarkAsUnread,
icon: 'close',
handler: () => {
this.markBookAsUnRead(book, selectedBookType)
}
},
{
text: this.tCancel,
role: 'cancel',
handler: () => {
return false;
}
}
]
});
await actionSheet.present();
The problem
When I activate the Action Sheet with an element close to the buttons, the app automatically selects a button. Reason: Due to the (press)-Event my finger is still on the screen. The button is activated by releasing the finger. How can I prevent this?