Ng-lazyload-image: Devolución de llamada cuando se carga la imagen

Creado en 18 jul. 2017  ·  5Comentarios  ·  Fuente: tjoskar/ng-lazyload-image

Hola, ¿qué pasa con la opción de implementación para recibir una notificación cuando se cargó la imagen? Será muy útil en muchos casos.
Sugiero este ejemplo de uso:

@Component({
    selector: 'image',
    template: `
      <div [hidden]="isLoading">
        <img 
          [defaultImage]="defaultImage" 
          [lazyLoad]="image" 
          [offset]="offset"
          (onLoad)="onImageLoad()" />
      </div>
      <div *ngIf="isLoading">
        <loader></loader>
      </div>
    `
})
class ImageComponent {
    defaultImage = 'https://www.placecage.com/1000/1000';
    image = 'https://images.unsplash.com/photo-1443890923422-7819ed4101c0?fm=jpg';
    offset = 100;
    isLoading = true;

    onImageLoad() {
      this.isLoading = false;
    }
}

Si la idea es buena, entonces podría hacer una solicitud de extracción, si es necesario.

Comentario más útil

Hola,
He estado pensando en esto y puedo ver algún caso de uso. Con mucho gusto acepto solicitudes de extracción :). Debería ser bastante fácil de implementar ya que este observador se emite cuando se carga la imagen: https://github.com/tjoskar/ng-lazyload-image/blob/master/src/lazyload-image.directive.ts#L37

Todos 5 comentarios

Hola,
He estado pensando en esto y puedo ver algún caso de uso. Con mucho gusto acepto solicitudes de extracción :). Debería ser bastante fácil de implementar ya que este observador se emite cuando se carga la imagen: https://github.com/tjoskar/ng-lazyload-image/blob/master/src/lazyload-image.directive.ts#L37

¡Necesita esto también! Comentando también para saber cuándo se fusionó.

Fijo en #177

Incluido en 3.2.0
Gracias @rimlin

¿Fue útil esta página
0 / 5 - 0 calificaciones

Temas relacionados

myrsk picture myrsk  ·  6Comentarios

vincent-cm picture vincent-cm  ·  10Comentarios

alisahinozcelik picture alisahinozcelik  ·  4Comentarios

AzerHeshim picture AzerHeshim  ·  5Comentarios

AndreasSchmid1 picture AndreasSchmid1  ·  3Comentarios