Virtual Scrolling List : not ordinary behaviour

[HamdySdiri]

unspected behaviour
i am using the VirtualScroll from the offical documentation.

Ionic Framework

my list contains most than 4 elements. but it will show up only 4 elements.
this is my code

<ion-col>
  <ion-grid>
    <ion-list [virtualScroll]="person">
      <ion-item *virtualItem="let p">
        {{p.name}}
      </ion-item>
    </ion-list>
  </ion-grid>
</ion-col>

this is the result :

Standard List:

what i can do to improve my Virtual Scrolling List

[williamdelvalle]

The syntaxis is

<ion-grid>
  <ion-col>
  </ion-col>
</ion-grid>

not

<ion-col>
  <ion-grid>
  </ion-grid>
</ion-col>

[HamdySdiri]

the same. nothing change. only 4 elmts will display

[williamdelvalle]

@HamdySdiri

<ion-col>
<ion-grid>
<ion-list [virtualScroll]=“person”>
<ion-item *virtualItem=“let p”>
{{p.name}}
</ion-item>
</ion-list>
</ion-grid>
</ion-col>

Checking the documentation and testing we can realize that a list does not work inside a grid, but if a grid within a list.

<ion-list [virtualScroll]=“items”>
  <ion-item *virtualItem=“let p”>
    <ion-grid>
      <ion-row>
        <ion-col col-12>{{p.name}}</ion-col>
      </ion-row>
    </ion-grid>
  </ion-item>
</ion-list>

[HamdySdiri]

thank you for your reply. that’s solve the problem
obviously i need to spend more time on reading the documentation

[williamdelvalle]

@HamdySdiri You’re welcome, that’s why we are here.