Angular Slickgrid无限滚动与拖拽排序异常问题求助

问题场景 #

在Angular Slickgrid实现中开启无限滚动（每页10条数据），同时通过设置enableRowMoveManager: true启用拖拽排序功能。初始数据中上下拖拽行一切正常，但滚动加载更多数据后，尝试拖拽行时网格完全混乱：

• 无法正常上下移动行
• 页面大小变为初始页大小+1（如10+1=11）

异常细节 #

拖拽结束后，onDragEnd事件返回的customEvent对象中，details->args->grid->data->items包含前N条数据+1个undefined条目（N为初始页大小，比如页大小20时是前20条+1个undefined）；再次拖拽会新增1个undefined条目。

相关代码 #

HTML代码

<angular-slickgrid [gridId]="gridId" (onScroll)="handleOnScroll($event)"
(onAngularGridCreated)="angularGridReady($event)" [columns]="columnDefinitions" [options]="gridOptions"
[dataset]="dataSet" (onSelectedRowsChanged)="handleSelectedRowsChanged($event)"
(onCellChange)="onCellChanged($event)" (onDragEnd)="handleOnDragEnd($event)">

核心函数代码

const STATE_CHECK_DELAY = 100;

handleOnScroll(args: any) {
    const viewportElm = args.detail.args.grid.getViewportNode();
    if (
      (['mousewheel', 'scroll'].includes(args.detail.args.triggeredBy ?? '') &&
      viewportElm.scrollTop > 0 &&
      Math.ceil(viewportElm.offsetHeight + args.detail.args.scrollTop) >= args.detail.args.scrollHeight)
    ) {
      const startIdx = this.angularGrid.dataView?.getItemCount() || 0;
      const newItems = this.loadData(startIdx, this.pageSize);
      this.angularGrid.dataView?.addItems(newItems);
    }
  }

loadData(startIdx: number, count: number) {
    const tmpData: any[] = [];
    for (let i = startIdx; i < startIdx + count; i++) {
      if(this.data[i]){
        tmpData.push(this.data[i]);
      }
    }
    return tmpData;
  }

handleOnDragEnd(args: any) {
    setTimeout(()=>{
      let data = [...args.detail.args.grid.data.items];
      data.forEach((res: any,index: number)=>{
        res.sequence = index
      })
      this.cellValueChanged.emit(data);
    },STATE_CHECK_DELAY)
  }

初始化代码

this.dataSet = this.loadData(0, this.pageSize);

已尝试操作 #

修改甚至移除handleOnDragEnd函数，问题仍未解决。

请求解决方案 #

恳请提供可行的修复方案。

内容的提问来源于stack exchange，提问作者pankaj meel