使用 angular4 的拖放事件在 IE11 中不起作用答案

【问题标题】：Drag and Drop event using angular4 is not working in IE11使用 angular4 的拖放事件在 IE11 中不起作用
【发布时间】：2018-03-25 14:47:44
【问题描述】：

我正在使用指令在将文件放在 HTML 元素上时获取文件，它在 chrome 中运行良好，但在 IE11 中无法运行。以下是拖放事件的代码从 '@angular/core' 导入 { Directive, HostListener, Output, EventEmitter };

@Directive({
  selector: '[appDragDrop]'
})
export class DragDropDirective {

  constructor() { }
  @Output()
  FileDragEvent: EventEmitter<File> = new EventEmitter<File>();

  @HostListener('window:drop', ['$event']) public onDrop(event) {

    event.preventDefault();
    event.stopPropagation();
    if (event.dataTransfer.items[0].type != 'application/vnd.ms-excel') {
      return false;
    }
    let files = event.dataTransfer.files;
    this.FileDragEvent.emit(files);
  }
  @HostListener('window:dragover', ['$event']) public onDragOver(evt) {
    evt.preventDefault();
    evt.stopPropagation();

  }

  @HostListener('window:dragleave', ['$event']) public onDragLeave(evt) {
    evt.preventDefault();
    evt.stopPropagation();

  }
}

最初我只是将这样用于@hostlistener

@HostListener('dragover',

但后来我读到一些博客要求我将其更改为这样

@HostListener('window:dragover',

我还尝试为具有拖放指令的元素提供最小高度，但我仍然面临这个问题。

该功能在 chrome 中运行流畅，但我在 IE11 中遇到问题

【问题讨论】：

到目前为止这个问题有什么更新吗？？

标签： javascript angular addeventlistener angular-directive

【解决方案1】：

从 IE 11 的某些样式 pointer-events: none 中删除，一切似乎都正常

【讨论】：