Relative Content

Tag Archive for angulartypescriptdrag-and-dropdraggableangular-cdk-drag-drop

Implement drag and drop functionality in recursive components

I’m trying to implement drag and drop functionality between two JSONs to map the keys of one JSON to another. I created the JsonViewerComponent that accepts JSON data as input and displays it using recursion. Primary key is also passed in the component that gives the flattened keys at every leaf node in the recursive tree. The JsonViewerComponent also accepts a flag isSourceJson which is used to display either a draggable element (having the flattened keys) after every key value pair in the JSON structure, or an element that acts as drop zone where the draggable element will be dropped.