Используйте функцию перетаскивания, чтобы заполнить поле ввода

Question

Поле ввода или текстовое поле должны изменить свое значение, когда пользователь перетаскивает текст в текстовую область.Ввод руководства пользователя также предотвращается путем предотвращения ударов по клавиатуре.

HTML для перетаскивания

<input (keydown)="preventKeyboard($event)" (drop)="fieldDrop($event)" class="k-textbox" [(ngModel)]="field">

<p draggable="true" (dragstart)="drag($event)">field</p>

Ручки для перетаскивания, предотвращения ввода пользователем и предотвращения ввода клавиш

drag(ev) {                                      //drag
  ev.dataTransfer.getData("text");
}

fieldDrop(ev) {                                 //drop
  let data = ev.dataTransfer.getData("text");
  ev.currentTarget.innerHTML = data;
}

preventKeyboard(e) {                            //prevent user key entry
let evt = e || window.event;
if (evt) {
  let keyCode = evt.charCode || evt.keyCode;
  if (evt.preventDefault) {
      evt.preventDefault();
  } else {
      evt.returnValue = false;
  }
 }
}

При перетаскивании значение изменяется неверно.

Скажите, если текущее значение поля ввода равно "abc", а затем, если в поле пропущено значение "def", значение изменяется на "abcdef" вместо "def".

Answer 1

Используйте setData для сохранения данных вместо getData, который дает вам сохраненные данные

Ваша функция dragStart () должна быть:

drag(ev) {                                     
 ev.dataTransfer.setData
("text",ev.currentTarget.innerHTML);
}