Angular 7 Drag & Drop вложенные списки с собственным CDK - PullRequest
Новая
       14

Angular 7 Drag & Drop вложенные списки с собственным CDK

0 голосов
/ 02 ноября 2018

Я использую собственный Angular 7 Drag & Drop, предоставленный @angular/cdk/drag-drop.

По сути, мне просто нужно создать один сортируемый список внутри другого, как показано в коде ниже: 

<div class="external-list" cdkDropList (cdkDropListDropped)="drop1($event)">
  <div class="external-item" cdkDrag *ngFor="let item of items">
    {{item.header}}
    <div class="internal-list" cdkDropList (cdkDropListDropped)="drop2($event)">
      <div class="internal-item" cdkDrag *ngFor="let row of item.rows">
        {{row}}
      </div>
    </div>
  </div>
</div>

Это очень схематичный пример только для демонстрации цели.

Проблема в том, что когда я пытаюсь перетащить внутренние элементы, вместо них перетаскиваются внешние.

Как я могу решить эту проблему, не прибегая к сторонним пакетам?

1 Ответ

0 голосов
/ 08 ноября 2018

Я думаю, вам нужно будет использовать ручку перетаскивания (cdkDragHandle для элемента внутри cdkDrag), по крайней мере, для родительского списка.

https://material.angular.io/cdk/drag-drop/overview#customizing-the-drag-area-using-a-handle

...