Input File onchange event not firing

Question

I am trying to fire onchange event everytime a file is selected. It does fire if the file I select is different, however, I wanted to fire even if the same file is selected twice.

html

  <input name="file" type="file"  (change)="onChange($event)" style="width:80%" /> 

component

onChange(event: any) {    let files = event.srcElement.files;    this.files = files;    event= null; } 

Answer 1

The most reliable way to achieve this cross browser and without having to change much code is to set the value of the input to null on click.

onclick="this.value = null" 

So your input would look like this

<input name="file" type="file" onclick="this.value = null" (change)="onChange($event)" style="width:80%"/> 

Here is an working example: plnkr