Question

问题：我需要一种方法来实现以下使用ng2-dragula丢弃行为。

我正在尝试构建类似于iOS上的app-launcher的东西＆安培; Android设备。
我想拖动项目A 并将其放在另一个现有项目的顶部乙
当我把它放在另一个项目B 之上时，我想对此做出反应创建一个包含两个项目的文件夹项目（可能是我将在angular / typescript逻辑中实现的功能。

在当前的ng2-dragula库中，当我拖动项目A ＆amp;放下 项目B 它在onDrop事件中向我提供了项目A 的详细信息，但它没有说明如何查找项目B 。

我正在努力弄明白，如何找到项目B 。意味着，如何确定哪个元素项目A 被删除？

演示：我创建了一个演示插件来显示拖拉设置和放大器一个锻炼。

private onDrop(args) {
    let [el, target, source] = args;
    // do something else
        console.log(`ondrop element: ${el.innerText.trim()}`);
        console.log(`ondrop target container: ${target.innerText.trim()}`);
        console.log(`ondrop source container: ${source.innerText.trim()}`);

  }

  private onDrag(args) {
    let [el, source] = args;
    // do something else
        console.log(`ondrag element: ${el.innerText.trim()}`);
        console.log(`ondrag source container: ${source.innerText.trim()}`);
  }

https://plnkr.co/edit/xXFWfS0Ae8fts2UL94mo

我尝试在元素上附加mouseover事件，然后在dragula onDrop事件中找到它，但它不捕获元素B细节（或者删除了任何项目A）。

您能否建议我如何解决这个问题？

非常感谢您的指导！

Answer 1

我不知道这是否有用，但是当您在拖放时订阅该值并将其放入ngOnInit时，执行该操作后的数据将在console.log时显示。像这样：

<强>组件

function(){
 this.service.drag.subscribe(value => {console.log(value)});
 this.service.drop.subscribe(value => {console.log(value)});
}
ngOnInit(){
 this.function();
}

如何获取有关丢弃源项的目标项详细信息（ng2-dragula / angular）

1 个答案: