Ng-lazyload-image: La imagen de carga diferida no funciona con el prearranque

Hola @ lares83 ,

Gracias por hacérmelo saber. Este es un tema bastante complicado, ya que no hay forma de saber cuándo la imagen se vuelve visible.

Una solución rápida es configurar offset=1 como sugieres, pero eso hará que todas las imágenes se carguen cuando se vuelvan visibles, incluso si no están en la ventana gráfica. Esto se debe a que ng-lazyload-image no tiene forma de saber dónde está la imagen antes de que se vuelva visible y en ese momento es demasiado tarde (no obtendremos un nuevo evento hasta que el usuario se desplace).

Una forma de solucionarlo es escuchar el evento PrebootComplete :

constructor() {
  this.scrollAndPrebootComplete$ = Observable.merge(
    Observable.fromEvent(window, 'scroll'),
    Observable.fromEvent(window, 'PrebootComplete')
  );
}

Y luego en la plantilla:

<img [lazyLoad]="lazyLoadImage" [scrollObservable]="scrollAndPrebootComplete$" />

Puede crear fácilmente un componente personalizado que envuelva lazyLoad y pase scrollAndPrebootComplete$ .

Otra solución es usar IntersectionObserver pero eso requiere que se resuelva # 304.

La solución rápida es establecer el atributo de desplazamiento en, por ejemplo, 1, lo que hace que intersectsWith devuelva verdadero.

Eso es en realidad un error, no debería estar sucediendo. Abriré una edición separada para ello.

Estoy cerrando esto. Avíseme que la solución propuesta anteriormente no funcionó.