swimlane / ngx-dnd

🕶 Drag, Drop and Sorting Library for Angular2 and beyond!
https://swimlane.github.io/ngx-dnd/
MIT License
575 stars 135 forks source link

ngx-dnd copy of draggable to sub droppable not working #147

Open isawk opened 5 years ago

isawk commented 5 years ago

I have a similar issue whiles attempting to create builder using directives, though modal is specified, in "grid", below input elements are not copied.

<ng-container *ngSwitchCase="'grid'">
    <div class="grid-x">
        <div class="cell large-auto medium-auto ngx-dnd-dropped-field-container_grid" dropZone="form-canvas" (drop)="elementDropped($event)" [removeOnSpill]="true" [model]="field.elements" ngxDroppable>
        </div>
        <div class="cell large-auto medium-auto ngx-dnd-dropped-field-container_grid" dropZone="form-canvas" (drop)="elementDropped($event)" [removeOnSpill]="true" [model]="field.elements" ngxDroppable>
        </div>
    </div>
</ng-container>

grid element

{ name: 'Grid', type: "grid", descritpion: 'Grid layout', icon: 'grid_on', elements: [] as any[]}

In the above, onDrop logs show field.elements with expected value, however in ngxDroppable, dropped item is not cloned.

Screenshot 2019-05-21 at 16 22 25

Image above shows that element [1] is successfully placed in Droppable, thus rendering [A], however when dropped in grid it is not rendered though it is successfully placed in [model]="field.elements"

Screenshot 2019-05-21 at 16 25 04

Image above shows that elements are successfully added to [model]="field.elements", however as indicated above render/copy doesn't work. Grid elements dropZone="form-canvas" same as over arching Droppable dropZone.

Originally posted by @isawk in https://github.com/swimlane/ngx-dnd/issues/60#issuecomment-494416702