Part -1 Precap: Introduction to drag and drop Angular Material CDK. Discussed cdkDrag Directive Discussed cdkDropList Directive Discussed the cdkDropListDropped event. Some simple examples Click here for full details of part-1. cdkDropListConnectedTo Directive: cdkDropListConnectedTo directive helps to drag and drop of items between the multiple cdkDropList instances. The communication between two different cdkDropList established either by assigning the cdkDropList template variable to the cdkDropListConnectedTo directive or by assigning the cdkDropList Html element id value to cdkDropListConnectedTo directive. cdkDropListData Directive: cdkDropListData Directive takes input like a component object that will render as Html Element items in cdkDropList instance. By assigning a component model object to cdkDropListData, makes our data to available in CDK drag and drop instance for sorting the data on each drag and drop of elements. transferArrayItem method: transferArrayItem method get