How to Use Drag And Drop in CkEditor5 Angular

Viewed 25

I use CkEditor5 according to this link In the list of contacts, I want to apply drag and drop, but it does not work properly,

It seems that this link does not properly explain how to call drag and drop And I don't know what to do

Is there a specific format or data to be applied in the e.dataTransfer.setData() method to drag and drop?

Does the onDrop event in CkEditor5 need a special command?

please guide me

Thanks

For Example

enter image description here

index.html

<!-- ... -->
<ckeditor *ngIf="loaded" class="editor-dragable" draggable="true" [config]="ckeditorConfig" [editor]="Editor" ngModel)]="model.ckEditoData" name="ckEditoData"></ckeditor>
  <ul class="paramsContainer row align-items-center">
      <li *ngFor="let item of items;let index = index">
          <div class="dragable params" [attr.data-contact]="index" [id]="'drag'+index" draggable="true">
             {{item.name}}
           </div>
      </li>
  </ul>
<!-- ... -->

index.ts

 items:any = [
     {
         name: 'Test 1',
         id: 1,
     },
      ...
 ];
 ckeditorConfig: any = {
    placeholder: 'write something',
 };

 Editor = ClassicEditor;

model:any={}

0 Answers
Related