ObaidUrRehman / ng-drag-drop

Drag & Drop for Angular - based on HTML5 with no external dependencies. :tada:

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Drop doesn't move item

westlakem opened this issue · comments

Please remove sections that are not required.

  • I'm submitting a ...
    [ X ] bug report
    [ ] feature request
    [ ] other

  • What is the current behavior?

Dropping an item doesn't move it

  • If the current behavior is a bug, please provide the steps to reproduce and if possible a minimal demo of the problem via https://plnkr.co or similar.
<div droppable>
  <li>
    <h1 draggable>Title</h1>
  </li>
  <h2 draggable>Subsection 1</h2>
  <img draggable src="assets/favicon.ico">
  <div draggable>
    My Text
  </div>
</div>

<div droppable>
  <h2> DROP ZONE</h2>
  <br>
  <br>
</div>
  • What is the expected behavior?

When I drag something into the drop zone it should move

  • Please tell us about your environment:
  • Angular version: 6.0.3
  • Chrome 64

I don't think this is a bug, it is expected behaviour. You need to specify the (onDrop) event to move items between containers. See https://github.com/ObaidUrRehman/ng-drag-drop#transfer-data-via-drag-drop

Hi, i have a similar error; Could you help me?

My case its the following:

I take (Drag) a element of my list1 and when i (Drop) this element on list2, It isnt move & send a Error on console:

TypeError: Cannot read property 'map' of undefined
at UserDashboardComponent.push../src/app/

I have reviewed the code and it is in this segment where it marks the error:

onDropSelected(e: DropEvent){
this.productList.push(e.dragData);
this.removeItem(e.dragData, this.products);
}

onDropProducts(e: DropEvent){
this.products.push(e.dragData);
this.removeItem(e.dragData, this.productList);
}

removeItem(item: any, list: Array) {
console.log(list);
let index = list.map(e => {
return e.name
}).indexOf(item.name);
list.splice(index, 1);
}

Thanks, bros