0
<ion-reorder-group (ionItemReorder)="reorderGroup($event)" disabled="false">
  <ion-item>
    <label>Group 1</label>
    <ion-reorder-group (ionItemReorder)="reorderRow1($event)" disabled="false">
      <ion-item>Row 1<ion-reorder slot="end"></ion-reorder></ion-item>
      <ion-item>Row 2<ion-reorder slot="end"></ion-reorder></ion-item>
    </ion-reorder-group>
    <ion-reorder slot="end"></ion-reorder>
  </ion-item>
  <ion-item>
    <label>Group 2</label>
    <ion-reorder-group (ionItemReorder)="reorderRow2($event)" disabled="false">
      <ion-item>Row 1<ion-reorder slot="end"></ion-reorder></ion-item>
      <ion-item>Row 2<ion-reorder slot="end"></ion-reorder></ion-item>
    </ion-reorder-group>
    <ion-reorder slot="end"></ion-reorder>
  </ion-item>
</ion-reorder>

This is working fine but when I try to drag the item for rows also the group item move.. My question is How can I prevent the group item from moving when I move the row item.

Thanks in advance..

  • I am currently checking this... https://stackoverflow.com/questions/54075606/angular-material-nested-drag-and-drop?rq=1 but its better if I use ion-reorder-group if its possible. – Aldon Prince Velasco Nov 20 '20 at 13:01

1 Answers1

1

if someone is looking for angular nested reorder try this.. @angular/cdk/drag-drop https://material.angular.io/cdk/drag-drop/overview I use this instead of ion-reorder because I cant find nested ion-reorder... Other user deleted this answer but this is the solution that helps me and it may help others.