'I am working on angular. I added ngx gallery. I have used foreach loop

  1. I have used this examle

https://www.npmjs.com/package/ngx-gallery

this.galleryImages = [
            {
                small: 'assets/1-small.jpg',
                medium: 'assets/1-medium.jpg',
                big: 'assets/1-big.jpg'
            },
            {
                small: 'assets/2-small.jpg',
                medium: 'assets/2-medium.jpg',
                big: 'assets/2-big.jpg'
            },
            {
                small: 'assets/3-small.jpg',
                medium: 'assets/3-medium.jpg',
                big: 'assets/3-big.jpg'
            }
        ];
    }

How can I get result like this in following code My code in TS file is

enter code here

this.products.getProductGalleryImages(this.router.snapshot.paramMap.get('id'))
      .subscribe(res => {
       var loopgalleryImage = JSON.parse(res[0].galleryimage_name);
       let arrayGalleryImg: String[] = [];
        Array.from(loopgalleryImage).forEach(function (element) {
          var singlegallaryImage: any  = element
          arrayGalleryImg.push(singlegallaryImage)
            arrayGalleryImg.push('{ small: ' + GlobalComponent.appUrl + 'galleryimages/' + element + ', medium: ' + GlobalComponent.appUrl + 'galleryimages/' + element + ', big: ' + GlobalComponent.appUrl + 'galleryimages/' + element + ',},');

        })
      console.log(arrayGalleryImg);

My code in HTML file is:

enter code here

<div class="col-xs-12 col-lg-6 col-md-12 col-sm-12 w-100">
            <ngx-gallery [options]="galleryOptions" [images]="galleryImages" class="ngx-gallery"></ngx-gallery>
</div>
ngx-gallery


Solution 1:[1]

`this.products.getProductGalleryImages(this.router.snapshot.paramMap.get('id')).subscribe(res => {
       let loopgalleryImage = JSON.parse(res[0].galleryimage_name);
         loopgallaeryImage.forEach(element=>{
               element.small:'your image path',
               element.medium:'your image path',
               element.big: 'your image path'
          })
        this.arrayGalleryImg = loopgallaeryImage
        })`

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Ajay Pawar

Related Questions