2014-01-09 18 views
14

Ich war eigentlich auf der Suche nach dem Inhalt der Zwischenablage mit eckigen JS, um eine Kopie Paste Ding zu simulieren.Wie bekomme ich Zwischenablage Daten in eckigen JS

+0

Highly [Winkel zeroclipboard] (https://github.com/lisposter/angular-zeroclipboard), ist es besser als 'ng-clip' dokumentiert . Ich habe auch nicht geschafft, 'ng-clip' zu funktionieren. – Fedor

+0

ng-clip hängt (zumindest in einigen Betriebsmodi) von ZeroClipboard ab und hat es in meinem Fall viel einfacher gemacht, die Funktion "Copy to Clipboard" zu integrieren. Ich folgte [diese wenigen Schritte] (https://github.com/asafdav/ng-clip#usage), um es zum Laufen zu bringen. –

Antwort

2

BTW, wenn Angular mit kopieren mit einem Chrome Packaged App in die Zwischenablage kopieren, gehen Sie wie folgt vor:

  1. hinzufügen "clipboardRead" und "clipboardWrite" auf die "Berechtigungen" in der manifest.json.
  2. Verwendung ng Klicken Sie in der Ansicht den Wert an die Steuerung $ scope zu füttern, wie: Daten-ng-click = "copyUrlToClipboard (file.webContentLink)"
  3. eine Funktion in Ihrem Controller wie gesagt:

    $scope.copyUrlToClipboard = function(url) { 
        var copyFrom = document.createElement("textarea"); 
        copyFrom.textContent = url; 
        var body = document.getElementsByTagName('body')[0]; 
        body.appendChild(copyFrom); 
        copyFrom.select(); 
        document.execCommand('copy'); 
        body.removeChild(copyFrom); 
        this.flashMessage('over5'); 
    }
6

habe ich eine Richtlinie für die Zwischenablage kopieren, die die document.execCommand() Methode verwendet.

Richtlinie

(function() { 
app.directive('copyToClipboard', function ($window) { 
     var body = angular.element($window.document.body); 
     var textarea = angular.element('<textarea/>'); 
     textarea.css({ 
      position: 'fixed', 
      opacity: '0' 
     }); 

     function copy(toCopy) { 
      textarea.val(toCopy); 
      body.append(textarea); 
      textarea[0].select(); 

      try { 
       var successful = document.execCommand('copy'); 
       if (!successful) throw successful; 
      } catch (err) { 
       console.log("failed to copy", toCopy); 
      } 
      textarea.remove(); 
     } 

     return { 
      restrict: 'A', 
      link: function (scope, element, attrs) { 
       element.bind('click', function (e) { 
        copy(attrs.copyToClipboard); 
       }); 
      } 
     } 
    }) 
}).call(this);  

Html

<button copy-to-clipboard="Copy Me!!!!" class="button">COPY</button> 
+0

Wie könnte man etwas anderes kopieren als "Kopiere mich !!!!" - wie zum Beispiel den Inhalt einer Textarea? – DaveC426913

+0

Verwenden Sie im Controller eine Bereichsvariable $ scope.copyMe = ''; und verwenden Sie diese Variable im Textarea-Wert wie folgt.