DragTargetContainerDirective
Represents the Kendo UI DragTargetContainer directive for Angular. Use this directive to make multiple elements draggable inside a container.
Definition
Package:@progress/kendo-angular-utils
Selector:[kendoDragTargetContainer]
Export Name:Accessible in templates as #kendoDragTargetContainerInstance="kendoDragTargetContainer"
Syntax:
<ul kendoDragTargetContainer dragTargetFilter=".my-draggable">
<li class="my-draggable"> Item 1</li>
<li class="my-draggable"> Item 2</li>
<li class="my-draggable"> Item 3</li>
</ul>Inputs
cursorStyle
string
Sets the cursor style of the drag targets. Accepts same values as the CSS cursor property.
'move'
Sets a callback function to return custom data for DropTarget events.
It exposes the current DragTarget HTML element, its dragTargetId, and its index in the collection of drag targets as arguments.
dragDelay
number
Sets the delay in milliseconds before dragging begins. See example.
0
dragDisabled
boolean
Disables dragging of drag targets in the container when set to true.
false
dragHandle
string
Sets a selector for elements inside each drag target to use as drag handles.
dragTargetFilter
string
Sets a selector for elements in the container to make them draggable. The possible values include any
DOM selector. See example.
Sets a unique identifier for each drag target. It exposes the current drag target HTML element and its index in the collection of drag targets as arguments.
hint
boolean | HintSettings
Defines whether a hint will be used for dragging. By default, the hint is a copy of the current drag target. See example.
false
threshold
number
Sets the number of pixels the pointer must move before dragging starts. See example.
0
Events
Fires while the user drags a drag target element.
Fires when dragging of a drag target ends and the element is released.
Fires when a drag target's dragDelay has passed and the user can drag the element.
Fires when dragging of a drag target element begins.
Fires when the user presses a drag target element.
Fires when the user releases a drag target element after pressing it.
Methods
Notifies the DragTargetContainer that its content has changed.