angular-拖放克隆图像不适用于助手：'clone' & 占位符：'keep'

Question

我正在尝试克隆图像并将其放入 可放置 区域，然后继续将该图像放入可放置区域，创建该图像的许多克隆。似乎可以将 angular-dragdrop 库与 helper: 'clone' & placeholder: 'keep' 一起使用，但我无法做到这一点，这可能是愚蠢的...

这里有一个笨蛋： http://plnkr.co/edit/yWcqgwefVD9Kf3Fpj4uI?p=preview

<div class="container" ng-show="vm.containerWidth !== '' && vm.containerHeight !== ''">
  <div class="row">
    <div class="col-md-9">
      <div style="border:solid #e3e3e3 1px; width:800px; height:{{vm.containerHeight + 40}}px; display: table-cell; vertical-align: middle;">
        <div ng-model="something" data-drop="true" data-jqyoui-options style="border:dashed #000000 1px; width:{{vm.containerWidth}}px; height:{{vm.containerHeight}}px; margin: 0 auto;" jqyoui-droppable="{onDrop: 'vm.drop'}"></div>
      </div>
    </div>
    <br /><br />
    <div class="col-md-3">
      This is a text button, try dragging to dotted box it wont copy:
      <div data-drag="true" jqyoui-draggable="{animate: false, placeholder: 'keep'}" data-jqyoui-options="{revert: 'invalid', helper: 'clone', opacity: 0.35}">
        <div class="btn btn-primary">Just a button here!</div>
      </div>
      <br /><br />
      This is an image, try dragging to dotted box it wont copy:<br />
      <img src="http://nilsagorgroup.com/nil_feed/wp-content/uploads/2013/02/Services-Packages-50x50-50x50.png" data-drag="true" jqyoui-draggable="{animate: false, placeholder: 'keep'}" data-jqyoui-options="{revert: 'invalid', helper: 'clone', opacity: 0.35}" />
    </div>
  </div>
</div>

该示例显示了一个按钮和一个图像，它们都是可拖动的。尝试将它们拖到虚线容器中，您会发现它们不会复制到该可放置区域。虽然，如果你在 onDrop 函数上放置一个断点，你会看到它被调用。

此外，我尝试将 helper 设置为 'original' 并允许它复制，但当然图像会消失（移动）到虚线区域，但我认为这很奇怪的是看着dom 您会注意到它在技术上没有移动，因为这个购物车示例显示该项目在移动。

http://codef0rmer.github.io/angular-dragdrop/#/cart

如有任何帮助，我们将不胜感激。

Answer 1

要进行交换，您需要在 draggable 和 droppable 上设置 ng-model

vm.list1 = {'title': 'Just a button here!', drag: true};
vm.something = [];

我只修复了按钮：http://plnkr.co/edit/oGD1My

angular-拖放克隆图像不适用于助手：'clone' & 占位符：'keep'

angular-dragdrop cloning an image isn't working with helper: 'clone' & placeholder: 'keep'

javascript

drag-and-drop

angularjs

angular-dragdrop