I have multiple input files dynamically added in angular. When I upload a file I want to change the only image of this input, but it is changing all the images of the input files. How can I fix that please.
images = [
{url: 'assets/images/icons/ico_upload.svg'},
{url: 'assets/images/icons/ico_cel.svg'}
];
img = this.images[0];
imgVisible = true;
fileChangeEvent(event: any, keyName): void {
this.imageChangedEvent[keyName] = event;
if(event.target.files.length > 0)
{
console.log(event.target.files[0].name);
this.img = this.images[1];
}else{
this.img = this.images[0];
}
}
html code:
<form [formGroup]="filterForm" class="filter-form" (ngSubmit)="Submit()">
<ng-container *ngFor="let item of questions2 ">
<div *ngSwitchCase="'file'" >
<div class="file">
<span class=ellipsis matTooltip="{{item.des}}">{{item.des}}</span><br />
<img [src]="img.url">
<label>
<input type="file" class="file-upload" (change)="fileChangeEvent($event,'sample')">
</label>
</div>
</div>
</ng-container>
</form>