How do I open an input type="file" dialog from Angular - ng2FileUpload

Question

I'm using ng2FileUpload to create the drag-n-drop for upload, but I also want to allow users to click on the drop area to open the file dialog.

Considering I have this input:

<input type="file" ng2FileSelect [uploader]="uploader" style="display: none" />

How can I show the file dialog from the Angular 4 typescript code?

Answer 1

I've been able to do it this way:

Template:

<input type="file" ng2FileSelect [uploader]="uploader" hidden #fileInput />

Angular Component:

@ViewChild('fileInput') fileInput:ElementRef;

public openFileDialog():void {
    let event = new MouseEvent('click', {bubbles: false});
    this.fileInput.nativeElement.dispatchEvent(event);
  }