0

Im create one app with drag and drop that are correct but when the user add items after the 10 items the drag grows too much and you can't see the other itema

This app is for to choose the order from dinamically modules, the app use angular 8(Updated from angular 6) i've tried to be using virtual scrolling but i had error with use drag and drop

<div cdkDropList #todoList="cdkDropList" [cdkDropListData]="names" class="example-list"
(cdkDropListDropped)="drop($event)">
<cdk-virtual-scroll-viewport>
    <div class="example-box" *cdkVirtualFor="let item of names; index as i" class="example-item" cdkDrag >{{item || 'Loading...'}}</div>
  </cdk-virtual-scroll-viewport>
  <button class="mat-icon-inline-2" mat-raised-button color="warn" (click)="deleteitem( (button_value = i) )">
    <mat-icon> delete </mat-icon>
  </button>
</div>
</div>
Yonatan Asael Garcia Ortiz
  • 13
  • 3

1 Answers1

0

Can you try with this one though it is Angular 7 but I feel it should work for Angular 8 too.

https://www.talkingdotnet.com/angular-7-virtual-scrolling-and-drag-and-drop-features/

Kabiraj Kharel
  • 153
  • 1
  • 10