valor-software/ng2-dragula

<div class='parent'>
    <label><strong>Click or Drag!</strong> Fires a click when the mouse button is released before a <code>mousemove</code> event, otherwise a drag event is fired. No extra configuration is necessary.</label>
    <div class='wrapper'>
        <div class='container' dragula="CLICKS">
            <div (click)='onclick("one")'>{{clicked.one ? "Clicked!" : "Clicking on these elements triggers a regular click event you can listen to."}}</div>
            <div (click)='onclick("two")'>{{clicked.two ? "Clicked!" : "Try dragging or clicking on this element."}}</div>
            <div (click)='onclick("three")'>{{clicked.three ? "Clicked!" : "Note how you can click normally?"}}</div>
            <div (click)='onclick("four")'>{{clicked.four ? "Clicked!" : "Drags don't trigger click events."}}</div>
            <div (click)='onclick("five")'>{{clicked.five ? "Clicked!" : "Clicks don't end up in a drag, either."}}</div>
            <div (click)='onclick("six")'>{{clicked.six ? "Clicked!" : "This is useful if you have elements that can be both clicked or dragged."}}</div>
            <div (click)='onclick("seven")'>{{clicked.seven ? "ZOMG, THAT TICKLES! PLEASE. STOP." : "Business as usual."}}</div>
        </div>
    </div>
    <pre><code>{{ code }}</code></pre>
</div>