blob: 7c35e6b84f51ddd8208bad05e7189f5d37872afc (
plain) (
blame)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
|
import { Directive, Output, EventEmitter, HostBinding, HostListener } from '@angular/core'
@Directive({
selector: '[myDragDrop]'
})
export class DragDropDirective {
@Output() fileDropped = new EventEmitter<FileList>()
@HostBinding('class.dragover') dragover = false
@HostListener('dragover', [ '$event' ]) onDragOver (e: Event) {
e.preventDefault()
e.stopPropagation()
this.dragover = true
}
@HostListener('dragleave', [ '$event' ]) public onDragLeave (e: Event) {
e.preventDefault()
e.stopPropagation()
this.dragover = false
}
@HostListener('drop', [ '$event' ]) public ondrop (e: DragEvent) {
e.preventDefault()
e.stopPropagation()
this.dragover = false
const files = e.dataTransfer.files
if (files.length > 0) this.fileDropped.emit(files)
}
}
|