Description
What is the expected behavior?
Reorder items in a list inside Mat-dialog using Angular Material Drag and Drop.
What is the current behavior?
Drag and drop does not work properly on the last items of the list. Previous and current index are the same in the moveItemInArray function
What are the steps to reproduce?
I have an array, where each item contains a list of colors. Clicking the edit button opens an Angular Material Dialog with the list of colors (for that item). The colors can be reordered using drag and drop. The list of colors from the first items of the list work fine, but when trying to reorder the list of colors in the last items of the list, drag and drop does not work. I did some debugging and found out that for the items not working, the event passed to the moveItemInArray, has the same number for the current and the previous index.
As previously mentioned, click on the edit button for one of the first items in the list and try reordering the colors, it works fine, choose the last item in the list and you will see the colors cannot be reordered, take a look at the console to get the previous and current indexes.
StackBlitz starter: https://stackblitz.com/edit/angular-u6dt7a
Not sure whether this is a CDK or a Mat-Dialog dialog.
Which versions of Angular, Material, OS, TypeScript, browsers are affected?
Angular 7, Angular Material 7.3.7
Chrome, Firefox
Is there anything else we should know?
When reducing the list of items to just a couple of them, then all list of colors for all items work fine. Problem starts when the list of items starts to grow in number.