Can't prevent click event after div dragEnd

I use Interact with angular and have ng-click handler on element. Click has called after my dragend event. How I can prevent that? Where I can add

.on('dragend', function (event) { 
  event.interactable.preventDefault(true); // doesn't work
  event.interactable.options.preventDefault = true ; // doesn't work
  event.preventDefault() ; // doesn't work

or smth else?

[taye]

I would think that this is really more of an Angular issue since interact.js’ tap event exists to bypass click problems.

There’s no default action from InteractEvents so their preventDefault method does nothing. Also, calling preventDefault on mousedown or mouseup events doesn’t stop clicks from happening. If you want to stop the click event then you should add a click event listener with useCapture that just calls event.stopImmediatePropagation().

interact(target).on('click', function (event) {
  event.stopImmediatePropagation();
}, true /* useCapture */);

[SlyDave]

I know this is an old issue, I just wanted to address the adding of the event every *end (resizeend, dragend etc) being a bad idea, simple add the once option to the Listener.

.on('dragend', function (event) {
    event.target.addEventListener('click', (event) => event.stopImmediatePropagation(), {capture: true, once: true});
}