防止浏览器在Angular中加载拖放文件

Question

我有一个页面（在Angular 4中）有一个拖放组件（ng2-filedrop）。拖放工作正常，但当我拖动一个文件并将其放到除拖放组件之外的页面中，即可打开该页面中的文件。

有什么办法可以禁用文件放置在其他地方或是否可以在独立浏览器选项卡中至少打开文件？

Answer 1

你可以做，通过覆盖全球window对象调用preventDefault()防止默认拖动浏览器的&拖放行为的dragover和drop事件。

添加下面的代码片段来ngOnInit()方法您app.component.ts的：

ngOnInit(): void { 
    window.addEventListener("dragover", e => { 
    e && e.preventDefault(); 
    }, false); 
    window.addEventListener("drop", e => { 
    e && e.preventDefault(); 
    }, false); 
} 

这不是我自己的答案，你可以看到在Prevent browser from loading a drag-and-dropped file

原来的答案，更多的讨论