cdk-virtual-scroll-viewport not sorting correctly

Question

I am using cdk-virtual-scroll-viewport to render a list. There is also a filter feature in my app. So when I load the page, the list is sorted correctly. But when I filter into the list, it messes up the sorting. Each time there is one row that is not sorted correctly and shown at the end of the table (shown as last row). The wrongly sorted row is random.

<cdk-virtual-scroll-viewport [itemSize]="30">
    <ng-container *cdkVirtualFor="let row of rows; let rowIndex = index; templateCacheSize: 20">
        <ng-template [ngTemplateOutlet]="rowTemplateDragDrop" [ngTemplateOutletContext]="{row: row, rowIndex: rowIndex, height: 30}">
        </ng-template>
    </ng-container>
</cdk-virtual-scroll-viewport>

Feel free to ask more questions, if needed to understand the issue.