TypeScript Как вставить данные из буфера обмена с помощью кнопки?

Я могу скопировать данные в буфер обмена с помощью нажатия кнопки, как показано ниже. Но как можно использовать то же поведение для получения данных из буфера обмена? Событие вставки работает только тогда, когда я щелкаю в поле ввода или текстовой области. Мне нужно, чтобы он мог работать с помощью кнопки.

Я пытался использовать window.clipboardData, но он не распознает его. Есть ли способ, которым я могу запустить событие Вставить через нажатие кнопки?

 Copy(val) {
    const selBox = document.createElement('textarea');
     selBox.style.position = 'fixed';
     selBox.style.left = '0';
     selBox.style.top = '0';
     selBox.style.opacity = '0';
     selBox.value = val;

     document.body.appendChild(selBox);
     selBox.focus();
     selBox.select();

     document.execCommand('copy');
     document.body.removeChild(selBox);
     this.icon = 'checkmark';
     this.copyButtonText = 'Copied!';
     this.tooltip = true;
 }

мой HTML

   <button #copyButton [icon]='this.icon' (click)="Copy(this.text)">{{copyButtonText}}</button>    
   <textarea [disabled]="true"> {{this.text}} </textarea>

1 ответ

Лучший способ добиться этого - использовать обработчик выбора окна.

let clipboardContent:string = "" //the clipboard content variable

window.addEventListener('copy', (e:ClipboardEvent) => {
  clipboardContent = window.getSelection().toString();
  //everytime someone copies some thing its text content 
  //is available within the clipboardContent variable
});

//now for the button press event you have the clipboard data
buttonElement.addEventListener('click', () => {
  //paste your content
  textareaElement.value = clipboardContent;
});
Другие вопросы по тегам