Can't hide drag-handle icon

[Marco]

I can't hide drag-handle icon when using *ngIf

The querySelector will not find an element with dragHandle Class:
https://github.com/ObaidUrRehman/ng2-drag-drop/blob/968ebbac52747c73b54f21bf09eea48322670e10/src/directives/draggable.directive.ts#L210

"ng2-drag-drop": "^2.9.2",

dragElement will be null here:
https://github.com/ObaidUrRehman/ng2-drag-drop/blob/968ebbac52747c73b54f21bf09eea48322670e10/src/directives/draggable.directive.ts#L199

Stacktrace:
ERROR TypeError: Cannot read property 'classList' of null
    at Function.webpackJsonp.../../../../ng2-drag-drop/src/shared/dom-helper.js.DomHelper.getElementWithValidClassList (dom-helper.js:62)
    at Function.webpackJsonp.../../../../ng2-drag-drop/src/shared/dom-helper.js.DomHelper.addClass (dom-helper.js:38)
    at Draggable.webpackJsonp.../../../../ng2-drag-drop/src/directives/draggable.directive.js.Draggable.applyDragHandleClass (draggable.directive.js:148)
    at Draggable.set [as dragEnabled] (draggable.directive.js:78)
    at updateProp (core.es5.js:11122)
    at checkAndUpdateDirectiveInline (core.es5.js:10822)
    at checkAndUpdateNodeInline (core.es5.js:12364)
    at checkAndUpdateNode (core.es5.js:12303)
    at debugCheckAndUpdateNode (core.es5.js:13167)
    at debugCheckDirectivesFn (core.es5.js:13108)

Example:

<div draggable [dragEnabled]="isMoveable" [dragData]="{data: data}" [dragHandle]="'.drag-handle'">
	<div>someOtherStuff</div>
	<div *ngIf="isMoveable">
		<mat-icon class="drag-handle md-24" aria-label="Move Card">open_with</mat-icon>
	</div>
	<div>someOtherStuff</div>
</div>

[Obaid ur Rehman]

@amperboy you are hiding the drag handle element instead of using the dragEnabled property on the draggable element. Setting this property sets/removes the drag handle cursor on the drag element.

Anyway, this is a bug and needs to be fixed. It shouldn't throw an error if the element is not found.

[Marco]

@ObaidUrRehman I also use dragEnabled Attribute to disable the dragability. But my stakeholder also want to hide the icon when dragging a component is disabled. As workaround I'm using the [hidden] directive.

[Obaid ur Rehman]

Ok, I understand your use case. Will fix

…

On Thu, Oct 12, 2017 at 11:50 AM, Marco ***@***.***> wrote: @ObaidUrRehman <https://github.com/obaidurrehman> I also use dragEnabled Attribute to disable the dragability. But my stakeholder also want to hide the icon when dragging a component is disabled. As workaround I'm using the [hidden] directive. — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#100 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/ABplrButQ2I08Ija6Ox-cMgIiMc7iyJjks5srbbDgaJpZM4P18z0> .

[Obaid ur Rehman]

Fixed in v3.0.1