Drag & Drop
Use
options = {
allowDrag: true
}
<Tree
[nodes]="nodes"
[options]="options"></Tree>
Listen
options = {
allowDrag: true
}
onMoveNode($event) {
console.log(
"Moved",
$event.node.data.name,
"to",
$event.to.node.data.name,
"at index",
$event.to.index);
}
<Tree
(onMoveNode)="onMoveNode($event)"
[nodes]="nodes"
[options]="options"></Tree>
Override
options = {
allowDrag: true,
actionMapping: {
mouse: {
drop: (tree:TreeModel, node:TreeNode, $event:any, to:{ node:TreeNode, index: number }) => {
// use tree.getDragNode() to get the current dragged node
// use to.node and to.index to get the parent node and index of drop location
// use TREE_ACTIONS.MOVE_NODE to invoke the original action
}
}
}
}
<Tree
[nodes]="nodes"
[options]="options"></Tree>
Updated less than a minute ago