title: Angular Drag and Drop absolute position elements selecting wrong index
body: <p>I'm trying to drag items across two lists. The bottom list is a typical sorted list (like an "inventory"), but I want the top items to be unsorted and droppable anywhere (like a "game board").</p>
  
  <p>I have it MOSTLY working, however when dropping into the top box event.currentIndex is always 0. But when dragging out from there I get different event.previousIndex values, which means the model and DOM elements don't always match.</p>
  
  <p>Here's a <a href="https://stackblitz.com/edit/two-drop-list-problem" rel="nofollow noreferrer">stackblitz</a> showing what I mean. Drag a few items into the top box and play around with it, you'll notice sometimes the wrong item gets moved. </p>
  
  <p>It's most notable when you interact in reverse order, for example:</p>
  
  <ol>
  <li>Drag items "One", "Two", "Three" into the top box (in that order)</li>
  <li>Try to put back items "Three", "Two", "One" back into bottom box (in that order)</li>
  </ol>
  
  <p><a href="https://i.stack.imgur.com/HCROi.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/HCROi.png" alt="enter image description here"></a></p>