带翻译Y的Nativescript列表视图

Question

使用translateY时，ListView不会显示整个列表。

我正在处理nativescript-ng应用程序。我有一个从后端获取的项目列表。 （即国家/地区列表）。 稍后，我尝试使用translateY属性将ListView向上移动，因为我想向用户显示整个列表，而不是限制他们仅查看屏幕的一部分。

<GridLayout rows="3*, 2*" columns="*">
  <MapView row="0" col="0" ... ></MapView>
  <ListView [items]="countries" class="list-group" row="1" col="0" (pan)="onPan($event)">
      <ng-template let-country="item" let-i="index" let-odd="odd" let-even="even">
          <!-- The item template can only have a single root view container (e.g. GridLayout, StackLayout, etc.)-->
          <StackLayout orientation="horizontal" class="list-group-item">
              <Label text="Country: " textWrap="true"></Label>
              <Label [text]="country.name"></Label>
          </StackLayout>
      </ng-template>
  </ListView>
  </GridLayout>
</GridLayout>

onPan(args: PanGestureEventData) {
    switch (args.state) {
      case 1:
        this.prevDeltaY = 0;
        break;
      case 2:
        this.dragContainer.translateY += args.deltaY - this.prevDeltaY;
        this.prevDeltaY = args.deltaY;
        break;
      case 3:
      default:
        break;
    }
  }

我希望当我向上移动ListView时，将显示列表中的更多项目。

实际： 列表的高度保持不变，不再显示任何项目，并且显示白色背景。