Kendo UI Angular Grid 选择 onSelectionChange 事件中的所有指示器

如何解决Kendo UI Angular Grid 选择 onSelectionChange 事件中的所有指示器

我的设置是在剑道 UI 网格中使用虚拟滚动和选择。 我的问题是我将通过单击表标题中的全选复选框来选择所有条目，但网格仅选择第一个虚拟页面（20 个条目）。

onSelectionChange 的事件 SelectionEvent 参数没有选择所有点击的指示器。

在我的示例中，您可以看到问题，使用我找到的唯一解决方案，但在当前虚拟页面中已经选择时不起作用

  public onSelectionChange(event: SelectionEvent) {
    console.log(event.index);
    if (event.selectedRows.length === this.pageSize) {
      // selected all click?
      this.selectedKeys = this.gridData.map(data => data.ProductID);
    }
    if (event.deselectedRows.length === this.pageSize) {
      // selected nothing click?
      this.selectedKeys = [];
    }

    this.selectText = `${this.selectedKeys.length}/ ${this.gridData.length}`;
  }

<kendo-grid
      [data]="gridView"
      [selectable]="{ checkBoxOnly: false,mode: 'multiple',enabled: true }"
      [selectedKeys]="selectedKeys"
      [kendoGridSelectBy]="selectionKey"
      scrollable="virtual"
      [rowHeight]="36"
      [height]="300"
      [skip]="skip"
      [pageSize]="pageSize"
      (pageChange)="handlePageChange($event)"
      (selectionChange)="onSelectionChange($event)"
    >
      <kendo-grid-checkBox-column
        [showSelectAll]="true"
        width="30"
        [locked]="false"
      >
      </kendo-grid-checkBox-column>
      <kendo-grid-column field="ProductID" title="ID" width="40">
      </kendo-grid-column>
      <kendo-grid-column field="ProductName" title="Name" width="250">
      </kendo-grid-column>
    </kendo-grid>

stackblitz link