Add cdkDragHandle inside component with cdkDrag in hostDirectives

In component I have something like this:

...
hostDirectives:[
{
directive:CdkDrag
}
]
...


Dragging works fine but when I want to add cdkDragHandle in template:

<div class="handle" cdkDragHandle></div>


nothing changes - still whole component works as handle. In cdkDrag reference this handle is visible but not working:

value: Array(1)
0: _CdkDragHandle
element: _ElementRef {nativeElement: div.cdk-drag-handle.handle}


What am I doing wrong?

Continue reading...