How to copy to clipboard without flash in AngularJS ?

By Hardik Savani | February 21, 2017 | Category : jQuery Angular

In this post we are going learn how to copy to clipboard in AngularJS application using ngclipboard js plugin. I provide very simple example using CDN, so you can simply run and understand well.

when require to give function of copy some text by clicking on button or any link. There are several library can do copy text using flash player, but in this example i will do it without using flash player. In this example we will use

ngclipboard.js AngularJS Plugin for copy to clipboard.

Now i am going to share with you full example of ngclipboard js plugin. I use cdn for jquery and ngclipboard js that way you can run easily for testing. You can also see demo. So let's see bellow example:


<!DOCTYPE html>



<title>How to copy to clipboard without flash in AngularJS ?</title>

<script type="text/javascript" src=""></script>

<script src=""></script>

<script src=""></script>

<script src=""></script>



<div class="container" ng-app="mainApp">

<!-- Target -->

<input id="foo" value="I am copied from">

<!-- Trigger -->

<button class="btn" ngclipboard data-clipboard-target="#foo">Copy to clipboard



<script type="text/javascript">

var app = angular.module("mainApp", ['ngclipboard']);




For more information you can get from here : ngclipboard.js

I hope it can help you....

Hardik Savani
My name is Hardik Savani. I'm a full-stack developer, entrepreneur and owner of Aatman Infotech. I live in India and I love to write tutorials and tips that can help to other artisan. I am a big fan of PHP, Javascript, JQuery, Laravel, Codeigniter, VueJS, AngularJS and Bootstrap from the early stage.
Follow Me: Github Twitter
***Do you want me hire for your Project Work? Then Contact US.

We are Recommending you: