Quiero crear un arreglo de imágenes que luego subiré a mi base de datos, por lo que estoy utilizando un input
de tipo file
pero al momento de crear el arreglo el primer elemento no lo agrega y además como transformar dicho arreglo en un json.
Html
<div class="container text-center">
<img *ngFor='let url of urls' [src]="url">
<input type="file" (change)="onselect($event)" multiple>
</div>"
Componente
urls=[];
onselect(e){
if(e.target.files){
var filesAmount = e.target.files.length;
for(let i=0; i < filesAmount; i++){
var reader = new FileReader();
reader.readAsDataURL(e.target.files[i]);
reader.onload=(events:any)=>{
this.urls.push(events.target.result);
}
}
}
console.log
del arreglo cuando agregas el primer elemento al arreglo me lo arroja vacío, y luego solo me muestra el ultimo elemento cargado.console.log
después dethis.urls.push(events.target.result);
imprimirá todas las url.