Stack Overflow
Stack Overflow

Questions tagged [angular-cdk-drag-drop]

168 questions
1
vote
0 answers

How to make set of mat-card containing different charts have drag and drop feature and auto align

HTML
1
vote
1 answer

Angular Material DragDrop in Table w/Expandable Rows loses expandable sync on all rows dragged over

I've modified the Angular Material Stackblitz to show my issue. It appears that cdkDragDrop is modifying the CSS of the rows the dragged list item goes over and then takes a few clicks of the expand/collapse button to re-sync. The rows that did not…
miesemer
  • 13
  • 2
1
vote
1 answer

cdkDrag with Transform scale in angular 14 weird behavior

I'm writing an angular 14 app and it contains a div element that is draggable using cdkDrag and also has two buttons to scale up or down the div. so in the component i save a scale version with default to one, and scale buttons add or dec 0.1 from…
ufk
  • 30,912
  • 70
  • 235
  • 386
1
vote
2 answers

div with cdkDrag on top of mat-slider doesn't hide the slider button

I'm writing an angular14 application. I have a div element that has cdkDrag for it to be moveable, and behind it i have a few buttons and sliders and i noticed that the slider button is still visible when i drag that div on top of that slider. i…
ufk
  • 30,912
  • 70
  • 235
  • 386
1
vote
1 answer

how to stop adding an index in a list when droping an element from one list to another using cdkDragDrop

enter image description here I am trying to add a row from one list to another list. cdkDragDrop works properly for moving a row in the same list but when i try to move a row from one list to another, a new index is created which I want to…
Ashish Rana
  • 13
  • 3
1
vote
1 answer

Sorting breaks when connecting cdkDropLists - Angular Material Drag Drop

I'm composing a form designer using Angular Material drag and drop. My problem is that after enabling drag-drop functionality, the sorting of items without nested drag-drops stops working. I want to make a list of components which can exist at the…
MoSlo
  • 535
  • 5
  • 11
1
vote
1 answer

Adding a directive to Kendo DialogService

Is it possible to add directives to a popup service, in our case we use Kendo and would like to add the cdkDrag directive to the popup, we have not been able to get the popup to be draggable. Only the contents in the popup are draggable. import {…
Francois Venter
  • 25
  • 7
1
vote
0 answers

CdkDragDrop Drop not working with "ng build --prod" configuration

I am using cdkDropList of Angular material CdkDragDrop. Drag is working but drop is not working. It is only happening when I am using "ng build --prod". I tried with removing all default configuration for production in angular.json file. Here is…
Gaurav Juyal
  • 31
  • 2
1
vote
0 answers

Angular scale is not working on cdk drag preview

In my angular application, I have a draggable div. Its parent is scaled down with CSS transform property. While drag the div, the cdk drag preview is not align with its parent's scaling. The div height and width gets back to its initial value which…
Harun Or Rashid
  • 5,589
  • 1
  • 19
  • 21
1
vote
1 answer

Angular component drag and drop with (optional) animation

I'm trying to build a main/dashboard page like the image given below. What I am trying to achieve is to be able to drag and drop the components labeled from 1-6 (they will all be separate components). I'm not sure if angular CDK drag and drop can be…
Haris Ali
  • 55
  • 1
  • 9
1
vote
1 answer

Problem importing CdkDragDrop in Angular project - Type 'Event' is missing the following properties from type 'CdkDragDrop..."

Firstly, I've seen Type 'Event' is missing the following properties from type 'CdkDragDrop'. However, I'm already importing the DragDropModule from '@angular/cdk/drag-drop' and my problems persist. I'm using Angular and Angular…
user1531921
  • 1,372
  • 4
  • 18
  • 36
1
vote
2 answers

Get item name in drag and drop

I am working on an angular app. I am using drag and drop in my application for reordering list. Code is as follows: https://stackblitz.com/edit/angular-drag-drop-sortable?file=app%2Fcdk-drag-drop-sorting-example.html component: import {Component}…
julie
  • 35
  • 6
1
vote
1 answer

ngb-accordion implement cdkdrag in ngb-panel

I'm try to create accordion using ngb-accordion with drag and drop support using cdkdrag, but when I'm using my drag and drop nothing happen, then I try move…
saiful haqqi
  • 95
  • 7
1
vote
2 answers

Can I stop the cdkDropList from expanding in Angular12

I am using Angular 12 drag and drop to move a mat-list-item to "dropzone" (cdkDropList) in another component. When I drag the item over the droplist, the droplist expands as if to make room for the item. Since this is not really a list, this…
ed4becky
  • 1,488
  • 1
  • 17
  • 54
1
vote
2 answers

Angular-Cdk-Drag-Drop getSortedItems is not instantly updated on drop event

I'm using a drag and drop list for a user to arrange items in the proper order. The issue I'm having is that there currently is a setTimeout in my code because the method to retrieve the order of the list is not instantly updated on drop. I suspect…
Jonathan
  • 8,771
  • 4
  • 41
  • 78
1 2 3
…
11 12