using input type file with angular material 2

Question

How can I use angular material 2 FAB buttons to open a browse input dialog? This can be done in HTML by this way.

<button type="button">     <label for="file-input">click</label> </button> <input type="file" id="file-input" style="display:none"> 

I tried following the same approach with material 2, but it doesn't work.

<button md-mini-fab type="button">     <label for="fileToUpload">         <md-icon>add</md-icon>     </label> </button> <input id="fileToUpload" type="file" style="display:none;"> 

Are there any other ways that will work? Thank you.

Answer 1

Here is a simple solution:

<button (click)="fileInput.click()">   <md-icon>library_add</md-icon>   <span>Select</span>   <input #fileInput type="file" (change)="onFileInput($event)" style="display:none;" /> </button>