I need to download a list of images using javascript in angular as a zip file..
so my website is an shopping website..if we click on a product it will open allthe images related to it.This is same as we have in amazon and flipkart shopping websites.
i had a button and when i click on the button i need to download all the images that are showing when clicked on the respective product.
The problem I am facing is that there are no images in the downloaded file.
here is the html part
<a class=”download” (click) = “download()” >
below is the .ts part and “this.Images” has all the image urls
download(){
let count = 0;
const zip = new JSZip();
this.Images.forEach((item) =>{
this.fileName = this.getfileName(item);
JSZipUtils.getBinaryContent(item, (err,data)=>{
if(err){
throw err;
}
console.log(data);
zip.folder("images").file(this.fileName,data,{base64: true});
count++
if(count === this.Images.length){
zip.generateAsync({type:'blob'}).then((content)=>{
fileSaver.saveAs(content, this.fileName);
});
}
});
});
}
getfiileName() method is as below
getfileName(str){
return str.substring(str.lastIndexOf('/')+1);
}
Note : I dont want to use JSZipUtils in my code