CngxCopyText
projects/common/interactive/copy/copy-text.directive.ts
Import#
import { CngxCopyText } from '@cngx/common/interactive'
Description#
Clipboard copy behavior - forms-free version for @cngx/common.
Place on a button or any clickable element. Copies the provided text to the
clipboard. Shows a copied signal for visual feedback (auto-resets after
resetDelay). Falls back to execCommand('copy') when Clipboard API is
unavailable.
Unlike CngxCopyValue from @cngx/forms/input, this has no forms dependency
and lives at Level 2 (@cngx/common), making it available to any consumer.
Copy a token
<code>{{ apiKey() }}</code>
<button [cngxCopyText]="apiKey()" #cp="cngxCopyText">
{{ cp.copied() ? 'Copied!' : 'Copy' }}
</button>Copy with SR announcement
<button [cngxCopyText]="shareUrl()">Copy Link</button>
<span aria-live="polite" class="sr-only">
{{ cp.copied() ? 'Link copied to clipboard' : '' }}
</span>Metadata#
Host#
Relationships
Index#
Methods
Inputs
Outputs
HostListeners
Inputs#
Outputs#
Instance Properties#
Signaltrue when the last copy attempt failed (permission denied, etc.). Resets on next attempt.
this.failedState.asReadonly()unknownWhether the Clipboard API is available in this environment.
typeof navigator !== 'undefined' && !!navigator.clipboardMethods#
HostListeners#
| Event | Handler |
|---|---|
(click) | click() |