diff --git a/README.md b/README.md index ff50e89..baeaf64 100644 --- a/README.md +++ b/README.md @@ -82,6 +82,7 @@ All outputs of [ngModel](https://angular.io/api/forms/NgModel#outputs) and * `focusChange` - called when the editor is focused or loses focus * `scroll` - called when the editor is scrolled (not wrapped inside angular change detection must manually trigger change detection or run inside ngzone) * `cursorActivity` - called when the text cursor is moved +* `drop` - called when file(s) are dropped ## License MIT diff --git a/src/lib/codemirror.component.ts b/src/lib/codemirror.component.ts index 398f305..170f5f9 100644 --- a/src/lib/codemirror.component.ts +++ b/src/lib/codemirror.component.ts @@ -84,6 +84,8 @@ export class CodemirrorComponent @Output() focusChange = new EventEmitter(); /* called when the editor is scrolled */ @Output() scroll = new EventEmitter(); + /* called when file(s) are dropped */ + @Output() drop = new EventEmitter<[Editor, DragEvent]>(); @ViewChild('ref', { static: true }) ref: ElementRef; value = ''; disabled = false; @@ -133,6 +135,12 @@ export class CodemirrorComponent (cm: Editor, change: EditorChangeLinkedList) => this._ngZone.run(() => this.codemirrorValueChanged(cm, change)), ); + this.codeMirror.on( + 'drop', + (cm: Editor, e: DragEvent) => { + this._ngZone.run(() => this.dropFiles(cm, e)); + } + ) this.codeMirror.setValue(this.value); }); } @@ -186,6 +194,9 @@ export class CodemirrorComponent cursorActive(cm: Editor) { this.cursorActivity.emit(cm); } + dropFiles(cm: Editor, e: DragEvent) { + this.drop.emit([cm, e]); + } /** Implemented as part of ControlValueAccessor. */ writeValue(value: string): void { if (value === null || value === undefined) {