drop event not working angular 2

I'm building upload component in angular 2 and i stumble into problem. (drop) event is not working. This is my implementation

<div
class="input-upload"
*ngIf="status != 'finished'"
(drop)="onDrop($event)"
(dragenter)="dragenter()"
(dragleave)="dragleave()"
(dragover)="dragover()"
[ngClass]="{'drag-over': dragOver | async}"
>

onDrop(event: any) {
event.preventDefault();
event.stopPropagation();
console.log(event)
}

Am i doing something wrong? I even put non existing function in (drop) event and angular is not giving error.

Solution

You need to call event.preventDefault() in dragOver(event) to inform the browser that the currently hovered element is a valid drop target.