Introduction

In this article, we will learn how to copy text to our clipboard and also copy the current date and time, using Angular 8.

Javascript provides a very good feature to copy any text to the clipboard and can paste it anywhere. So in this article, we will copy some text and the current date and time to our clipboard and paste it to a textarea. 

Prerequisites

• Basic knowledge of Angular.
• Visual Studio Code must be installed.
• Angular CLI must be installed.
• Node JS must be installed.

Step 1

Let’s create an Angular project, using the following npm command.

Step 2

Open the newly-created project in Visual Studio code and install bootstrap in this project.

Now, open the styles.css file and add a Bootstrap file reference. To add the reference in styles.css file add this line:

Step 3 

Now, let’s create a new component by using the following command:

Step 4

Now, open the copy-clipboard.component.html file and add the following code: 

Step 5

Now, open the copy-clipboard.component.ts file and add the following code:

Step 6

Now, open the app.module.ts file and add the following code in this file.

Step 7

Let’s copy the below code and paste it to app.component.html. 

Step 8 

Now, let’s run the project by using npm start or ng serve command and check the output.

Summary

In this article, I have discussed how we can copy any text to the clipboard and paste not only the text, but also the current date and time in Angular 8 applications.

Please give your valuable feedback/comments/questions about this article. Please let me know if you liked and understood this article and how I could improve upon it.