Ng-lazyload-image: Défilement horizontal ionic2

Salut,

Je suppose que lazyContainer.ionScroll n'émet des événements que lors du défilement vertical pour une raison quelconque. Pouvez-vous essayer d'imprimer la valeur de ionScroll pour voir si elle émet des valeurs lorsque vous faites défiler.

<ion-scroll scrollX="true" #lazyContainer>
  <img class="thumbnail-avatar-square spacer" *ngFor="let item of recent"
    (click)="tapped(item)"
    [scrollObservable]="lazyContainer.ionScroll"
    [lazyLoad]="item.avatar">
  {{ lazyContainer.ionScroll | async | json }}
</ion-scroll>

@kodeine , n'hésitez pas à rouvrir ce problème si le problème persiste

Salut,

D'abord... @tjoskar félicitations. Ce travail comme prévu sur Ionic 3.9.2. Cependant, j'ai le même problème avec ion-scroll. Je viens d'essayer d'imprimer la valeur de ionScroll avec le tube async/json et je retourne null. Donc je suppose que c'est la raison qui ne fonctionne pas.

Une solution de contournement pour ce problème ionique?

Mise à jour : j'ai essayé la même chose avec un exemple de travail et ionScroll renvoie également null ?

Ça marche. La clé est de définir scrollTarget sur scroll._scrollContent.nativeElement

Code complet ci-dessous

`` javascript <ion-scroll scrollX="true" direction="x" #scroll1> <div class="item" margin *ngFor="let item of newItems" (click)="goToItemPage(item)"> <img src="./assets/imgs/placeholder.png" [lazyLoad]="item.photoThumb?.url()" [scrollTarget]="scroll1._scrollContent.nativeElement" /> <div text-center text-wrap> <p no-margin>{{ (item.shortName || item.name) | excerpt:17 }}</p> </div> </div> </ion-scroll>

Salut @fmendoza J'ai plusieurs lignes où chacune devrait être des images à défilement horizontal et à chargement paresseux
Cependant, seules les lignes visibles affichent des images lors du premier chargement.
Le défilement vertical pour exposer d'autres lignes ne déclenche pas le chargement de l'image.
Je voudrais activer le chargement de ces images sur le défilement vertical de mon contenu ionique et le défilement horizontal de mon défilement ionique
de telle sorte que je le fasse fonctionner avec deux scrollTargets. un pour le défilement d'ions et l'autre pour la teneur en ions
Veuillez aider

J'ai utilisé le hack ci-dessous pour contourner le problème d'avoir une liste à défilement horizontal en dehors de la fenêtre de défilement vertical du contenu principal.
Dans mon cas, je sais que les 2 premiers éléments de chaque liste sont toujours visibles dans le défilement vertical du contenu principal, je connecte donc leur conteneur de défilement à <ion-content #content> . Et le reste des éléments de la liste est connecté au <ion-scroll scrollX="true" #recentScroll> du défilement horizontal.

<ion-content #content>
        <!-- more ion-scrolls here -->
    <ion-scroll #recentScroll scrollX="true">
        <ng-container *ngFor="let subitem of recentItems; let i = index">
            <horizontal-item [item]="subitem" 
                                [scrollContainer]="content._scrollContent.nativeElement" 
                                (openItem)="showItemDetails($event, true)"
                    *ngIf="i < 2"></horizontal-item>
            <horizontal-item [item]="subitem" 
                                [scrollContainer]="recentScroll._scrollContent.nativeElement"
                                (openItem)="showItemDetails($event, true)"
                   *ngIf="i >= 2"></horizontal-item>
        </ng-container>
    </ion-scroll>
        <!-- more ion-scrolls here -->
</ion-content>