tjoskar / ng-lazyload-image

🖼 A small library for lazy loading images for Angular apps with zero dependencies
https://naughty-bose-ec1cfc.netlify.com
MIT License
763 stars 142 forks source link

Some image still default when using with ngx-swiper-wrapper #550

Open MrHOY opened 2 years ago

MrHOY commented 2 years ago

Version: "ng-lazyload-image": "^9.1.1", "ngx-swiper-wrapper": "^10.0.0", "@angular/*": "13.0.2" "rxjs": "6.6.0",

I used ngx-swiper-wrapper directive to show list image, but some image still show image default instead of lazyload

component.html:

<div class="swiper-responsive-breakpoints swiper-container" [swiper]="swiperResponsive">
     <div class="swiper-wrapper">
          <div  class="swiper-slide swiper-slide-gallery relative" *ngFor="let item of galleries">
              <img
                class="img-gallery"
                [defaultImage]="'assets/images/loading-image.gif'"
                [lazyLoad]="item?.image?.image_s3_url"
                [scrollObservable]="scrollObservable"
                alt="banner"
              />
           </div>
       </div>
   </div>

I try set : this.scrollObservable = fromEvent(document.getElementsByClassName('swiper-container')[0], 'slideNextTransitionEnd');

but it doesn't work anymore

tjoskar commented 2 years ago

Hi @MrHOY, Is it possible for you to create a small project where you can reproduce this issue?

AndreBezBirolo commented 1 year ago

Put the loop: false;