https://github.com/andreasnicolaou/ngx-copy-to-clipboard
NgxCopyToClipboard is an Angular directive that enables easy text copying to the clipboard with a single click. It supports customizable success/error messages and triggers events on copy actions.
https://github.com/andreasnicolaou/ngx-copy-to-clipboard
expression-language javascript typescript
Last synced: 7 months ago
JSON representation
NgxCopyToClipboard is an Angular directive that enables easy text copying to the clipboard with a single click. It supports customizable success/error messages and triggers events on copy actions.
- Host: GitHub
- URL: https://github.com/andreasnicolaou/ngx-copy-to-clipboard
- Owner: andreasnicolaou
- Created: 2020-02-25T20:26:54.000Z (over 5 years ago)
- Default Branch: master
- Last Pushed: 2025-03-06T23:23:06.000Z (8 months ago)
- Last Synced: 2025-03-23T01:35:34.321Z (7 months ago)
- Topics: expression-language, javascript, typescript
- Language: TypeScript
- Homepage:
- Size: 124 KB
- Stars: 2
- Watchers: 1
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
- awesome-angular - ngx-copy-to-clipboard - An Angular directive that enables easy text copying to the clipboard with a single click. It supports customizable success/error messages and triggers events on copy actions. (Third Party Components / Directives)
- fucking-awesome-angular - ngx-copy-to-clipboard - An Angular directive that enables easy text copying to the clipboard with a single click. It supports customizable success/error messages and triggers events on copy actions. (Third Party Components / Directives)
README
# NgxCopyToClipboard
Click and copy to your clipboard fast
## Why is there a need Copy to clipboard?
> The "Copy to clipboard" directive is a useful feature that allows users to quickly and easily duplicate content from one location and paste it into another. It is particularly useful when working with text, as it eliminates the need to manually retype or reformat content.
[](https://www.npmjs.com/package/@andreasnicolaou/ngx-copy-to-clipboard)
## Installation
#### 1. Install via NPM:
```shell
npm i --save @andreasnicolaou/ngx-copy-to-clipboard
```
#### 2. Import `NgxCopyToClipboardModule` into your app's root module or common module
```typescript
import { NgxCopyToClipboardModule } from '@andreasnicolaou/ngx-copy-to-clipboard';
@NgModule({
...
imports: [
NgxCopyToClipboardModule
],
...
})
export class AppModule { }
```
| Inputs | Description |
| ------------------------- | ----------------------------------------------------------------------------------- |
| `textToCopy` | String Text to copy |
| `successMessage` | On copy success message |
| `errorMessage` | On copy error message |
| `onCopyEvent` | On copy event get success message (has default message-ovverid) |
| `onErrorEvent` | On copy event get error message (has default message-ovverid) |
#### Example
```typescript
const val = 'Hello World!';
public onSuccess(ev: string){
console.log(ev);
}
public onError(ev: string){
console.log(ev);
}
```
```html
Copy
```
## Contribution
- **Having an issue**? or looking for support? [Open an issue](https://github.com/andreasnicolaou/ngx-copy-to-clipboard/issues/new) and we will get you the help you need.
- Got a **new feature or a bug fix**? Fork the repo, make your changes, and submit a pull request.
## Support this project
If you find this project useful, please star the repo to let people know that it's reliable. Also, share it with friends and colleagues that might find this useful as well. Thank you :smile: