离子虚拟卷轴不显示答案

【问题标题】：Ionic Virtual Scroll not displaying离子虚拟卷轴不显示
【发布时间】：2018-07-16 17:23:50
【问题描述】：

我正在尝试使用 Virtual Scroll 在 Ionic 3 中显示图片列表。

我的代码如下：图片

 <div *ngIf="picturesByChildIndex && picturesByChild">
  Pictures
  <div *ngFor="let child of picturesByChildIndex; index as childIndex">
    <div [virtualScroll]="picturesByChild[childIndex]" [approxItemHeight]="pictureSize + 'px'" [approxItemWidth]="pictureSize + 'px'" [bufferRatio]="5">
      <div class="">
        {{picturesByChild[childIndex] | json}}
      </div>
      <div *virtualItem="let pictureEntity" class="image-container"
      [style.width]="pictureSize + 'px'" [style.height]="pictureSize + 'px'"
      (click)="onOpenPicture(pictureEntity?.$key, $event)">
      <ion-img [src]="pictureEntity?.thumb" class="image" tappable></ion-img>
    </div>
  </div>

  </div>

</div>

我的控制器中的对象：

picturesByChildIndex ["child2", "child1", "-Kr2WLq5XxjnrDzAizTF"]
picturesByChild (3) [Array(3), Array(4), Array(3)]
picturesByChild[0] "child2"
  insertTimestamp: 1500362912
  thumb: "https://storage.googleapis.com/..."
  $exists: ƒ ()
  $key: "-KpJaJATCnHtaSU1Pjqn"

最后，pictureSize 是 125

知道为什么不显示图片吗？我只看到文字Pictures，没有别的

【问题讨论】：

我不确定这是否是我的解决方案，因为 virtualItem 中的任何内容都不会显示事件文本。
从我在互联网上看到的情况来看，*ngFor 中的virtualScroll 不受支持。

标签： angular ionic-framework ionic2 ionic3

【解决方案1】：

我遇到了与您相同的错误，解决方案非常简单：我必须从 *ngIf 块（或在您的情况下为 ngFor）中删除 virtualScroll。

显然条件与滚动的负载相互作用。

我将其置于条件之外，并使用了一种解决方法来重新启用我传递给虚拟滚动的数组上的条件。

希望对遇到同样问题的人有所帮助

【讨论】：