Угловое перетаскивание с использованием TransferArrayItem указывает на неправильный номер индекса при фильтрации (рабочий пример)

Question

Я пытаюсь отфильтровать список элементов, используя CDK Drag Material ... все работает хорошо, когда мой список не фильтруется, однако, когда я фильтрую его и перетаскиваю, я получаю неправильный элемент (неверный индекс) по капле я создал рабочий пример, как вы можете видеть, отфильтруйте, скажем, «av» и перетащите авокадо в область перетаскивания, и вы получите Carrot, поскольку индекс ссылается на старый источник данных, любые идеи приветствуются,

Вот рабочий пример проблемы: https://stackblitz.com/edit/angular-agf3kv-wjxwdm?file=app/cdk-drag-drop-disabled-sorting-example.css

Шон

Answer 1

обязательно позвоните: this.dtable.renderRows();, так как это обновит пункт назначения.

Answer 2

Вы должны использовать itemsFiltered как cdkDopListData.

<div
  cdkDropList
  [cdkDropListData]="itemsFiltered" <-- HERE
  class="example-list"
  cdkDropListSortingDisabled
  (cdkDropListDropped)="drop($event)">
  <div class="example-box" *ngFor="let item of itemsFiltered" cdkDrag>{{item}}</div>
</div>

Stackblitz