Anarkie Anarkie - 2 years ago 386
TypeScript Question

Browse the same file again and again in html

I have the following code on my html

<input type="file" style="display: none" #file(change)="processImage($event)" />
<button type="button" class="btn" (click)="" Browse </button>

I choose image1 from desktop, it is loaded on html by
then I delete it with delete button. Then I browse again and choose image1 again but nothing happens, when I choose image2, then it is loaded, afterwards I choose image1 it is again loaded. In summary choosing the same image again does nothing, probably it isn't a change event. It also makes sense. But for some reason a user may load it again and again after loading and deleting.

How I display the image:

<div *ngIf="isImageLoaded" class="showImg"><img [src]="myImage"></div>

Any tips to be able to load the same image and fire

Answer Source

You have to clear event.currentTarget.value as below, I have tried locally and it works fine. whenever you select any image even it repeat always fire processImage method.

public processImage(event:any):void{
     //your logic    
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download