The Clipboard API
The Angular CDK's Clipboard API offers a directive and a service to interact with the operating system's clipboard through the browser. The CdkCopyToClipboard directive can be used declaratively while the Clipboard service is used for use cases where a programmatic API is a better fit. The Clipboard API additionally takes care of long texts through the PendingCopy class.
In this section, you will learn how to use each of these classes from the Angular CDK package.
The CdkCopyToClipboard directive
The CdkCopyToClipboard directive is exported by ClipboardModule, which is in the @angular/cdk/clipboard sub-package. Its directive selector is [cdkCopyToClipboard]. The directive has an input property of the same name as the directive, which accepts the text that is copied when the element it is attached to is clicked.
Because of browser security concerns, copying text to the clipboard must be done following a click event triggered by a user.
The...
