如何将特定div文本以角度js复制到剪贴板

时间:2017-06-26 02:00:29

标签: javascript jquery html angularjs

我只是在Angular JS中创建一个随机密码生成器。结果如何来自应用程序

<div data-ng-model="password" id="password">
   <input class="form-control" data-ng-model="password" id="password" placeholder="The new strong password will appear here" type="text">
</div>

现在我想通过按钮复制剪贴板中的生成密码。我该怎么办?

2 个答案:

答案 0 :(得分:0)

您可以使用 ngClipboard ngclip 模块执行相同操作

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

<强>样本

&#13;
&#13;
  var myapp = angular.module('myapp', ["ngClipboard"]);

  myapp.config(['ngClipProvider', function(ngClipProvider) {
      ngClipProvider.setPath("//cdnjs.cloudflare.com/ajax/libs/zeroclipboard/2.1.6/ZeroClipboard.swf");
  }]);

  myapp.controller('myctrl', function ($scope) {
    
  });
&#13;
<!doctype html>
<html>
<head>
  <link href="//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
  <script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.20/angular.min.js"></script>
  <script src="//cdnjs.cloudflare.com/ajax/libs/zeroclipboard/2.1.6/ZeroClipboard.min.js"></script>
  <script src="//rawgit.com/asafdav/ng-clip/master/src/ngClip.js"></script>
</head>
<body>

<div ng-app="myapp">
  <div class="container" ng-controller="myctrl">

    <div class="page-header">
      <h1> <small>ngClip</small></h1>
      <h2>CilpBoard copy example</h2>
    </div>

    <form>
      <div class="form-group">
        <label >Copy #1</label>

        <textarea class="form-control" value="Hello" placeholder="Enter text to copy" ng-model="copy1">Hello</textarea>
      </div>
      <button class="btn btn-default" clip-copy="copy1">Copy!</button>

     

      <textarea class="form-control" rows="3" placeholder="paste here"></textarea>
    </form>
  </div>
</div>

<script>

</script>

</body  >
</html>
&#13;
&#13;
&#13;

答案 1 :(得分:0)

&#13;
&#13;
var myApp = angular.module('myApp',[]);

myApp.controller('MyCtrl', function($scope) {
$scope.CheckClicked = function(){
debugger;
  if($scope.Duplicatepsw){
    $scope.psw2 = $scope.psw1;
  }
  else{
    $scope.psw2 = angular.copy($scope.psw2);
  }
};
});
&#13;
<!DOCTYPE html>
<html lang="en">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
<div ng-app="myApp" ng-controller="MyCtrl">
<div>
 Password <input type="text" ng-model="psw1" />
</div>
  <div>
  copiedpassword <input type="text" ng-model="psw2" />
</div>
<div>
Duplicate of textbox1 and replicate in textbox2  <input type="checkbox" ng-click="CheckClicked()" ng-model="Duplicatepsw" />
</div>
</div>
</html>
&#13;
&#13;
&#13;