ItemSliding prevent close on click/tap


#1

Hello All,

RC0. Is there any way to prevent an ion-item-sliding list item from closing when you click a button or the list item itself? I’d prefer to keep the sliding item open when clicking a button, if possible. I’ve tried adding directives and click events to ion-item-sliding and to the ion-item within, attempted to catch the $event and preventDefault and stopPropagation but nothing seems to keep the list item from closing when you either click a button or click the list item itself.

Thanks.


#2

I think I found a temporary solution, although it feels a little dirty and I’m unsure that it will continue to work.

On the button, within , instead of using a (click) event I am using a (touchend) event, making sure to pass the event to the method:
(touchend)=“onMethod($event,slidingItem)”

Within the method I am stopping immediate propagation so it doesn’t bubble up.
onMethod( event ) { event.stopImmediatePropagation(); }

The only issue I currently have with this is that after you click the button with the touchend event, you cannot slide open another list item right away, it takes one more click for it to register.


#3

Hi
I found in the library:

ItemSlidingGesture.prototype.notCaptured = function (ev) {
    if (!clickedOptionButton(ev)) {
        this.closeOpened();
    }
};
...
function clickedOptionButton(ev) {
    var ele = ev.target.closest('ion-item-options>button');
    return !!ele;
}

So i just place my target block into corresponding tag (button) and as result it will no close.

PS. I think it’s strange to assign behaviour to specifig tag wraper.