我被困在我的一个WebPage中进行拖放。 由于拖动图像具有半透明的限制。因此,我为我的元素创建了一个克隆的元素。
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();
}
}
当我在上面的场景中拖动Element时出现问题,因为我的Code没有进入drop事件。
但是,如果我发表评论
this.ng2DragDropService.dragImage.style.top= mouseY + "px";
代码行或使用顶部以外的位置(如底部,右侧)我的拖放工作正常,但在这种情况下拖动图像的定位不是我需要的。
请指导或帮助,我做错了什么,因为我已经在这个问题上花了2天时间。
P.S - >我在Angular 2中使用tgis Drag and Drop。
答案 0 :(得分:0)
我想你可能想学习一些自定义角度指令。
这是一个受欢迎的资源:https://github.com/nervgh/angular-file-upload
和演示: http://nervgh.github.io/pages/angular-file-upload/examples/simple/