17.3.2 • Published 1 month ago
ngx-copypaste v17.3.2
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
}