ng-copy, ng-cut, ng-paste example in AngularJS


        ng-copy, ng-cut, ng-paste are some basic AngularJS events used to perform copy (Ctrl + C), paste (Ctrl + V) and cut (Ctrl + X) action that we perform using keyboards. Lets see them with some example.

ng-copy example : Execute an event when text in the input field in copied

ng-copy syntax :

<ng-copy
  ng-copy="expression">
...
</ng-copy>
<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<body ng-app="">

<input ng-copy="count = count + 1" ng-init="count=0" value="Copy me !" />

<p>The text has been copied {{count}} times.</p>

</body>
</html>

Just copy the text in the Input text box using mouse or keyboard shortcut - Ctrl+C.

Output
ng-cut example : Execute an event when text in the input field is cut

ng-cut syntax
<ng-cut
  ng-cut="expression">
...
</ng-cut>

<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<body ng-app="">

<input ng-cut="count = count + 1" ng-init="count=0" value="Cut me !" />

<p>The text has been cut {{count}} times.</p>

</body>
</html>

Just cut the text in the Input text box using mouse or keyboard shortcut - Ctrl + X.

Output

ng-paste example - Execute an event when text in the input field is cut

ng-paste syntax

<ng-paste
  ng-paste="expression">
...
</ng-paste>

<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<body ng-app="">

<input ng-paste="count = count + 1" ng-init="count=0" value="Paste here!" />

<p>Text has been pasted {{count}} times.</p>

</body>
</html>

Just paste some text in the Input text box using mouse or keyboard shortcut - Ctrl + V.

Output

Hope this helps..



Reactions:

0 comments :

Post a Comment