在拖放中自定义拖动图像时出现问题

Question

我被困在我的一个网页中进行拖放操作。 由于拖动图像具有半透明的限制。所以，我为我的元素创建了一个克隆元素。

this.test = e.target.cloneNode(true);
this.test.style.position = "absolute";
document.body.appendChild(this.test);
this.ng2DragDropService.dragImage = this.test;

创建元素后，我将使用以下代码将上面创建的元素拖动到上面：

  let mouseX = e.pageX;
  let mouseY = e.pageY;
    if (this.allowDrop(e)) {
        if (this.el.nativeElement.classList != undefined && this.el.nativeElement.classList != null)
            this.el.nativeElement.classList.add(this.dragOverClass);
            e = e || window.event;
                this.ng2DragDropService.dragImage.style.backgroundColor = "orange";
                this.ng2DragDropService.dragImage.style.left= mouseX + "px";
                this.ng2DragDropService.dragImage.style.top=  mouseY + "px";
        e.preventDefault();
}
}

当我在上述场景中拖动元素时出现问题，因为我的代码没有进入 drop 事件。

但是，如果我注释掉

this.ng2DragDropService.dragImage.style.top=  mouseY + "px";

代码行或使用除顶部以外的位置（如底部、右侧）我的拖放工作正常，但在这种情况下，拖动图像的定位不是我需要的。

请指导或帮助，我做错了什么，因为我已经在这个问题上花了 2 天时间。

P.S --> 我在 Angular 2 中使用 tgis 拖放。

Answer 1

我猜你可能想了解一些关于自定义角度指令的知识。

这是一个受欢迎的资源：@​​987654321@

和演示： http://nervgh.github.io/pages/angular-file-upload/examples/simple/