Search code examples
javascriptangularjszeroclipboard

Angular plugin ZeroClipboard not working


I'm rather new to Angular. I'm trying to use a module called ZeroClipboard.

I eddited my application to load the module and set the config as described in the demo.

var app = angular.module('JpqlEditor', ['ngRoute', 'ngResource', 'ui.bootstrap', 'toaster', 'chieffancypants.loadingBar', 'zeroclipboard']).
  config(['uiZeroclipConfigProvider', function(uiZeroclipConfigProvider) {

    // config ZeroClipboard
    uiZeroclipConfigProvider.setZcConf({
      swfPath: 'assets/flash/ZeroClipboard.swf'
    });

  }])

In my HTML I added the same structure as in the demo:

<input type="text" ng-model="myText" />
<button ui-zeroclip zeroclip-copied="copied=true" zeroclip-model="myText">Copy</button>
<span ng-show="copied">Text Copied!</span>

However, on page load I'm getting following error:

enter image description here

I don't see where I went wrong, I followed all the steps explained. Any help would be greatly appreciated.


Solution

  • You must have missed to add ZeroClipboard.js & script sequence of loading should be

    1. ZeroClipboard.js
    2. angular-zeroclipboard.js

    Thanks :)