import { Directive , ElementRef , HostListener , Input , HostBinding } from '@angular/core' ; import { TreeModel } from '../models/tree-view.model' ; import { NgxTreeService } from '../ngx-tree-dnd.service' ; @ Directive ( { selector : '[libDragElement]' } ) export class DragElementsDirective { constructor ( private el , private treeService ) { } @ Input ( ) item : TreeModel ; @ Input ( ) draggableValue : boolean ; @ HostBinding ( 'draggable' ) get draggable ( ) { return this . draggableValue ; } @ HostListener ( 'dragstart' , [ '$event' ] ) onDragStart ( event ) { const eventObj = { event , target : this . item } ; this . treeService . isDragging = this . item ; this . treeService . lastExpandState = this . item . options . hideChildrens ; this . item . options . hideChildrens = true ; this . item . options . currentlyDragging = true ; this . treeService . startDragging ( eventObj ) ; event . stopPropagation ( ) ; } @ HostListener ( 'drag' , [ '$event' ] ) onDrag ( event ) { const eventObj = { event , target : this . item } ; this . treeService . onDragProcess ( eventObj ) ; } @ HostListener ( 'dragend' , [ '$event' ] ) onDragEnd ( event ) { const eventObj = { event , target : this . item } ; this . item . options . hideChildrens = this . treeService . lastExpandState ; this . item . options . currentlyDragging = false ; this . treeService . dragEndAction ( eventObj ) ; event . stopPropagation ( ) ; } }