ng2-file-upload — dnd works, clicking to select does not

Question

I'm tasked with making an multi-image uploader in an old Angular 7 that uses ng-file-upload. It has a single image uploader that works fine, and my new multi-image uploader (using the same implementation) works fine too, except...

If I drag and drop images, when logging $event in the fileDropped() method, I get a File object, but if I click and select a file, I get an event object with no File. E.g.:

isTrusted: true
bubbles: true
cancelBubble: false
...

I'm pretty sure this is a simple implementation issue but I'm not sure where to debug. TI'm hoping that someone has just encountered this before and knows off the top of their head what it is.

// in template
<div ng2FileDrop class="file-drop-sm" 
  [uploader]="fileUploader"
  [ngClass]="{'hover': hasAnotherDropZoneOver}"
  (onFileDrop)="fileDropped($event)" 
  (fileOver)="fileOver($event)"
>
...
<input id="bulkUploader" 
  value="null" type="file" ng2FileSelect [uploader]="fileUploader"
  accept="{{allowedFileTypes}}"
  (change)="fileDropped($event);" 
  style="display:none"
  [multiple]="isMultiple" 
/>

// in component

public async fileDropped($event) {
  console.log($event); // drag/drop returns File, but selecting returns event object.
...
}

TL;DR - dnd works, clicking to select returns event object with no File.

Answer 1

A small typo. Change the change method to onFileSelect and it will work!

<input id="bulkUploader" 
  value="null" type="file" ng2FileSelect [uploader]="fileUploader"
  accept="{{allowedFileTypes}}"
  (onFileSelect)="fileDropped($event);" 
  style="display:none"
  [multiple]="isMultiple" 
/>