Awesome

<a href="http://jsdaddy.io/img/logo.png"> <h1 align="center">NGX COPYPASTE</h1> </a> <p align="center"> NGX COPYPASTE is the best directive to copy any content on any element </p>

You can also try our NGX MASK check it. You can also try our NGX LOADER INDICATOR check it.

You can try live demo with examples.

Installing

$ npm install --save ngx-copypaste

Quickstart if ngx-copypaste version >= 15.0.0

Pay attention this version works for angular >= 14.0.0

Import ngx-copypaste directive to your standalone component

@Component({
  selector: 'ngx-component',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss'],
  standalone: true,
  imports: [
    (...)
    NgxCopyPasteDirective,
    (...)
  ],
})
export class AppComponent {
    (...)
}

Quickstart if ngx-copypaste version < 15.0.0

Pay attention this version works for angular < 15.0.0

Import ngx-copypaste module in Angular app.

import {NgxCopyPasteModule} from 'ngx-copypaste'

(...)

@NgModule({
  (...)
  imports: [
    NgxCopyPasteModule
  ]
  (...)
})

Usage

From input

<input type="text" ngxCopyPaste #cp="copy" />

<button (click)="cp.copy()">Copy</button>

From any HTML tag

<p ngxCopyPaste #cp="copy">Lorem ipsum</p>

<button (click)="cp.copy()">Copy</button>

From complex div

<div ngxCopyPaste #cp="copy">
    <h1>Lorem ipsum</h1>
    <p>
        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam rutrum augue at ante
        sollicitudin posuere. Pellentesque congue consequat enim quis luctus.
    </p>
    <div>
        <h2>Lorem ipsum</h2>
    </div>
</div>

<button (click)="cp.copy()">Copy</button>

Also you can bind it to any tag

<p ngxCopyPaste #cp="copy">Lorem ipsum</p>

<p (click)="cp.copy()">Copy</p>

Output success cb

<p ngxCopyPaste #cp="copy" (successCb)="copy()">Lorem ipsum</p>

<p (click)="cp.copy()">Copy</p>

public copy(): void { your code }