Stack Overflow
Stack Overflow

Questions tagged [angular-cdk]

Use this tag for questions concerning your own components using the Angular CDK (Component DevKit) or Angular Material components that depend on the Angular CDK's APIs, like the MatTable.

Angular's Component Development Kit (CDK) gives developers tools to build their own Angular components addressing common problem patterns while giving the user full control over the components' styles. It is created alongside the Angular Material project.

The full list of features can be found at the official docs.

Learn more about the CDK in the official release post.

673 questions
10
votes
4 answers

Draggable formGroups in formArray (reactive forms)

In angular drag-drop module, they provided documentation for the moveItemInArray() function, by using this we can only drag content in an array only. but, how we could shuffle (formGroups/formControls) in formArray? Even I tried this…
Gopal
  • 603
  • 10
  • 18
10
votes
5 answers

Angular material stepper before-selection-change & prevent step-change for some condition

I am using linear mat-stepper. It works fine with next. I do api call & if it's success then i call stepper-next event instead of using matStepperNext directive. Now when user fills all data on step 1 & directly click on some other step in header…
Ankur Akvaliya
  • 2,989
  • 4
  • 28
  • 53
10
votes
1 answer

How to remove auto focus on button inside angular material modal?

When we place button inside angular material dialog it is auto focussing first button in that modal. Stackblitz example
mani singh
  • 241
  • 2
  • 4
  • 9
10
votes
1 answer

How to use cdk-virtual-scroll-viewport for table tbody

since html parse tr then td, using breaks the view is there any cdkVirtualScrollViewport as directive for ?
david valentino
  • 920
  • 11
  • 18
10
votes
1 answer

cdk-virtual-scroll with mat-autocomplete works irregular

I try to use the cdk-virtual-scroll inside a mat-autocomplete:
IHaanstra
  • 196
  • 1
  • 9
9
votes
1 answer

angular cdk drag drop - adjust autoscroll speed when dragging

UPDATE 11.07.2020 Issue on Github https://github.com/angular/components/issues/19401 ORIGINAL POST Is there a way to adjust the scroll speed when dragging an item down or up the list? In Firefox on macOS, it behaves as expected, scrolling faster the…
Han Che
  • 8,239
  • 19
  • 70
  • 116
9
votes
0 answers

Implementing Drag and Drop in an Angular Material tree - nest node when another node is hovered

This question has been brought up a number of times on SO, but not recently, and the example here is more complete than other ones I have seen. The best implemention of drag and drop with a material tree is this one posted here on medium by…
Meqwz
  • 1,319
  • 8
  • 14
9
votes
2 answers

How to disable CDK Drop due to condition

I'm trying to find a way how to disable dropping by using CDK due to some conditions.If the list which I wanna drop is empty should be disabled.I couldn't find a way to do that inside a method in .ts file.There are some HTML directives for that but…
Timuçin Çiçek
  • 1,516
  • 3
  • 14
  • 39
9
votes
2 answers

Angular CDK Drag Drop - Transfer Item without Loss of Visibility

It appears to have been activated when I examined the item. This class is:"cdk-drop-list-receiving". How do I do what I want not to be lost in any way? Thank you in advance. Alternative Image URL: https://i.hizliresim.com/DOOkP6.gif This is not a…
nmb
  • 124
  • 1
  • 9
9
votes
1 answer

Reposition CdkConnectedOverlay on scroll

I'm trying to use CdkConnectedOverlay to display an overlay when a button is clicked. It's mostly working, but the overlay is not re-positioning on scroll. I'm sure there's something small I'm missing, but I can't for the life of me figure it…
cory
  • 93
  • 1
  • 5
9
votes
1 answer

Drag and Drop on Mat-Dialog (Angular Material CDK) not working. Wrong previous and current index

I have a list of themes, and each them has a list of colors. I display all the themes with a button that opens an Angular Dialog, in the dialog I list all the colors for that theme and these colors can be reordered @angular/cdk/drag-drop. If I have…
tif
  • 1,109
  • 2
  • 12
  • 32
9
votes
1 answer

Angular CDK Overlay, change default overlay container

Is there a way to change the OverlayContainer? I have created a tooltip component, but sometimes I want to attach the overlay to a specific element (by default the overlay is attached to the document body). Here is how I am creating the overlay: …
vlio20
  • 8,955
  • 18
  • 95
  • 180
9
votes
7 answers

How to make a mat-table row drag-drop work with cdkDragHandle so that the row is only draggable using the handle?

I found this stackblitz example of adding drag-drop to a mat-table using angular cdk. However, the desired behavior is that the row is only draggable using the element with the cdkDragHandle directive. In this example you can drag the element by…
phelhe
  • 699
  • 3
  • 14
  • 20
9
votes
4 answers

cdk-virtual-scroll-viewport,Any way to solve the blank area when user is scrolling quickly?

Especially obvious at the mobile.it will refresh immediately whenever the user scrolls, if user is scrolling quickly, it is hard to render?
rorry
  • 111
  • 1
  • 3
9
votes
1 answer

Angular Material table row (click) event triggered when clicking an action in a cell within that row

How can you trigger a modal with a button inside a mat-table without triggering the rows (click) event? I've seen and read with Angular Material 2 Table Mat Row Click event also called with button click in Mat Cell however the solution of using…
Foo
  • 93
  • 1
  • 1
  • 7
1 2 3
…
44 45