July 2018
Intermediate to advanced
402 pages
9h 35m
English
The draggable directive will be attached to the elements that we want to enable for drag and drop. Let's get started by creating a new directive using the Angular CLI tool:
ng generate directive --spec false draggable/draggable
Let's open the directive class file, located in src/app/draggable/draggable.directive.ts, and add the following code:
import {Directive, HostBinding, HostListener, Input} from '@angular/core';import {DraggableType} from '../model';@Directive({ selector: '[macDraggable]'})export class DraggableDirective { @HostBinding('draggable') draggable = 'true'; @Input() draggableData: any; @Input() draggableType: DraggableType; @HostBinding('class.dragging') dragging = false;}
By setting the ...