ng-clip

0.2.6 • Public • Published

ngClip - Copy to clipboard using AngularJS

An AngularJS simple directive that uses ZeroClipboard and updates the user's clipboard.

How to get it ?

Manual Download

Download the from here

Bower

bower install zeroclipboard ng-clip

Npm

npm install zeroclipboard ng-clip

CDN

ng-clip is available at cdnjs

Usage

  1. Add ng-clip.js and ZeroClipboard.js to your main file (index.html)

  2. Update the .swf path location using ngClipProvider

  .config(['ngClipProvider', function(ngClipProvider) {
    ngClipProvider.setPath("bower_components/zeroclipboard/dist/ZeroClipboard.swf");
  }]);
  1. Set ngClipboard as a dependency in your module
var myapp = angular.module('myapp', ['ngClipboard'])
  1. Add clip-copy directive to the wanted element, example:
<a href="" clip-copy="getTextToCopy()" clip-click="doSomething()">Copy</a>
  1. You can optionally override zeroclipboard config parameters using ngClipProvider
    ngClipProvider.setConfig({
      zIndex: 50
    });
  1. You can optionally specify the MIME type by providing using the clip-copy-mime-type attribute:
<a href="" clip-click"getHtmlToCopy()" clip-copy-mime-type="text/html">Copy HTML</a>
  1. You can also optionally provide a fallback function that gets called if flash is unavailable:
<a href="" clip-click-fallback="fallback(copy)" clip-copy="getTextToCopy()" clip-click="doSomething()">Copy</a>

If the fallback function is defined to accept an argument named copy, that argument will be populated with the text to copy.

Examples

You can check out this live example here: http://plnkr.co/xwV5Yn see the examples folder for more

Bitdeli Badge

Versions

Current Tags

  • Version
    Downloads (Last 7 Days)
    • Tag
  • 0.2.6
    2,583
    • latest

Version History

  • Version
    Downloads (Last 7 Days)
    • Published
  • 0.2.6
    2,583
  • 0.2.5
    12
  • 0.2.4
    0

Package Sidebar

Install

npm i ng-clip

Weekly Downloads

2,017

Version

0.2.6

License

none

Last publish

Collaborators

  • asafdav