Provide Text inside the draggable content. about angular2-draggable HOT 6 CLOSED

@Ekaanth I think you might set [preventDefaultEvent] to true. Turning it off can make it work.
But if you need to set [preventDefaultEvent], I suggest to use handle to drag div. Only handle element will be affected by [preventDefaultEvent].

from angular2-draggable.

@Ekaanth Sure, you can use an array to store multiple blocks and use *ngFor to render multiple draggable div.

A simple example:

<div *ngFor="let b of blocks">
    <div ngDraggable class="drag-block">
        <textarea></textarea>
    </div>
</div>

<button (click)="addBlock()"></button>

blocks = [];

addBlock() {
    this.blocks.push({ text: '' });
}

from angular2-draggable.

This code worked for me.

<div ngDraggable class="drag-block" (edge)="checkEdge($event)" (started)="onStart($event)" (stopped)="onStop($event)" (movingOffset)="onMoving($event)" [preventDefaultEvent]="false" (endOffset)="onMoveEnd($event)" [bounds]="myBounds" [inBounds]="inBounds">
                        <textarea name="" id="" cols="30" rows="1"></textarea>
                    </div>

Thanks for your support it worked for me.
Now, I have a button on click of that is displaying the div, is it possible for me to get multiple divs on click of the button multiple times and all those draggable divs should be different from others so that I can enter different text msg in different draggable div.

Thanks.

from angular2-draggable.

Hello sir, thanks for your help, and I have a doubt, is it possible to know the x and y position in % not in 'px' because with the change in the screen resolution the position of the element should be same.

from angular2-draggable.

@Ekaanth Currently, it only supports translating by length not percentage. Maybe we can support this feature in future.

from angular2-draggable.

Thanks a lot @xieziyu

from angular2-draggable.