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

2024-03-06

I am using a directive to get the files when it is dropped on the HTML element, it is working fine in chrome but it is not working in IE11. enter image description here the following is the code for the drag and drop event import { Directive, HostListener, Output, EventEmitter } from '@angular/core';

@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 中遇到问题


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

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

使用 angular4 的拖放事件在 IE11 中不起作用 的相关文章

随机推荐