title: Angular 8 Nested Drag And Drop
body: <p>unfortnually I can't find a solution in a common problem.</p>
  
  <p>Here is the link to the code <a href="https://stackblitz.com/edit/angular-ygwaxs" rel="nofollow noreferrer">https://stackblitz.com/edit/angular-ygwaxs</a></p>
  
  <p>I've got this scenario: from the server I got a json tree structure (in the example there's a semplification directly inside the component)</p>
  
  <p>There are empty nodes, but everyone got their children array declared.</p>
  
  <p>I've tried to manage this rappresentation inside a componente using at html level ng-template and ng-container and that's work.</p>
  
  <p>The problem is that I need to use drag and drop for sorting nodes.</p>
  
  <p>In the specific, every section can be child or parent so, every section can be draggable and droppable.</p>
  
  <p>I've tried to implemet it with the Angular Material 8 CDK Drag &amp; Drop (<a href="https://material.angular.io/cdk/drag-drop/overview" rel="nofollow noreferrer">https://material.angular.io/cdk/drag-drop/overview</a>) and with vanilla Javascript using API of Drag&amp;Drop too (<a href="https://developer.mozilla.org/" rel="nofollow noreferrer">https://developer.mozilla.org/</a>…/…/API/HTML_Drag_and_Drop_API) but, if in the first case the fact of having nested drag and drop do not help to work the solution, in the second one, I've got tests but inside of Angular component, the event bind for drop (drop) doesn't seem to be accepted; when I try to drag a section inside a tag dropzone the cursor change in no-drop.</p>
  
  <p>Anyone can help me?</p>