diff --git a/README.md b/README.md index 09d7b548..68c84a72 100644 --- a/README.md +++ b/README.md @@ -59,6 +59,7 @@ import { Component } from '@angular/core'; }) export class DemoApp { uploadFile: any; + hasBaseDropZoneOver: boolean = false; options: Object = { url: 'http://localhost:10050/upload' }; @@ -69,6 +70,10 @@ export class DemoApp { this.uploadFile = data; } } + + fileOverBase(e:any):void { + this.hasBaseDropZoneOver = e; + } } ```` @@ -79,6 +84,17 @@ export class DemoApp { [options]="options" (onUpload)="handleUpload($event)"> + + +
+
+
Response: {{ uploadFile | json }}
diff --git a/src/directives/ng-file-drop.ts b/src/directives/ng-file-drop.ts index 671d8c42..3e9780fd 100644 --- a/src/directives/ng-file-drop.ts +++ b/src/directives/ng-file-drop.ts @@ -12,10 +12,11 @@ import {Ng2Uploader} from '../services/ng2-uploader'; selector: '[ngFileDrop]' }) export class NgFileDropDirective { - + @Input() events: EventEmitter; @Output() onUpload: EventEmitter = new EventEmitter(); @Output() onPreviewData: EventEmitter = new EventEmitter(); + @Output() onFileOver:EventEmitter = new EventEmitter(); _options:any; @@ -110,4 +111,15 @@ export class NgFileDropDirective { this.uploader.addFilesToQueue(this.files); } } + + @HostListener('dragover', ['$event']) + public onDragOver():void { + this.onFileOver.emit(true); + } + + @HostListener('dragleave', ['$event']) + public onDragLeave():any { + this.onFileOver.emit(false); + } + }