Solução 1: copie qualquer texto
HTML
<button (click)="copyMessage('This goes to Clipboard')" value="click to copy" >Copy this</button>
arquivo .ts
copyMessage(val: string){
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);
}
Solução 2: Copiar de um TextBox
HTML
<input type="text" value="User input Text to copy" #userinput>
<button (click)="copyInputMessage(userinput)" value="click to copy" >Copy from Textbox</button>
arquivo .ts
/* To copy Text from Textbox */
copyInputMessage(inputElement){
inputElement.select();
document.execCommand('copy');
inputElement.setSelectionRange(0, 0);
}
Demonstração aqui
Solução 3: importar uma diretiva de terceiros ngx-clipboard
<button class="btn btn-default" type="button" ngxClipboard [cbContent]="Text to be copied">copy</button>
Solução 4: Diretiva Personalizada
Se você preferir usar uma diretiva personalizada, verifique a resposta de Dan Dohotaru, que é uma solução elegante implementada usando ClipboardEvent
.