Динамически загружать строку и столбец галереи изображений ионной сетки

Question

У меня есть массив изображений из 20 изображений. Я хочу динамически загружать свои изображения в виде сетки виртуальной прокрутки, в которой каждая строка имеет 4 столбца, но не знаю, как это сделать

Это мой текущий код

<ion-content>
    <ion-grid [virtualScroll]="photo_library">
      <ion-row *virtualItem="let photo" ng-if="$index % 4 === 0">
        <ion-col>
            <ion-img [src]="photo.avatarUrl"></ion-img>
        </ion-col>
      </ion-row>
    </ion-grid>
  </ion-content>

Но это генерирует строку и 1 столбец, но я хочу динамически иметь 4 столбца в одной 1 строке. Как мне этого добиться?

Answer 1

<ion-content>
    <ion-grid >
      <ion-row [virtualScroll]="photo_library" >
        <ion-col col-6 col-md-4 col-xl-3 *virtualItem="let photo ">
            <ion-img [src]="photo.avatarUrl"></ion-img>
        </ion-col>
      </ion-row>
    </ion-grid>
  </ion-content>