Menu ▼



Posted By :
avatarmrkraju
Total Views : 982

AngularJS ng-copy ng-cut and ng-paste directory example

ng-copy
The ng-copy directive will be used to define custom behaviour/functionality on copy event.

Syntax

<input type="text" ng-model="copyval" ng-copy="copyevt();" />

$scope.copyevt = function () {
    //implement your cusotm functionality.
    alert("Copy event fired");
};

ng-cut
The ng-cut directive will be used to define custom behaviour/functionality on cut event.

Syntax

<input type="text" ng-model="cutval" ng-cut="cutevt();" />

$scope.cutevt = function () {
    //implement your cusotm functionality.
    alert("Cut event fired");
};

ng-paste
The ng-paste directive will be used to define custom behaviour/functionality on paste event.

Syntax

<input type="text" ng-model="pasteval" ng-paste="pasteevt();" />

$scope.pasteevt = function () {
    //implement your cusotm functionality.
    alert("Paste event fired");
};

Example

Copy the text in textbox.


Cut the text in textbox.


Paste some text in textbox.

Source code

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.16/angular.min.js"></script>
</head>
<body>
    <div ng-app="myApp" ng-controller="myCntrl">
        Copy the text in textbox.
        <br />
        <input type="text" ng-model="copyval" ng-copy="copyevt();" />
        <br />
        <br />
        Cut the text in textbox.
        <br />
        <input type="text" ng-model="cutval" ng-cut="cutevt();" />
        <br />
        <br />
        Paste some text in textbox.
        <br />
        <input type="text" ng-model="pasteval" ng-paste="pasteevt();" />
    </div>
    <script language="javascript">
        var myapp = angular.module("myApp", []);
        myapp.controller("myCntrl", function ($scope) {
            $scope.copyval = "Copy this text";
            $scope.copyevt = function () {
                //implement your cusotm functionality.
                alert("Copy event fired");
            };
            $scope.cutval = "Cut this text";
            $scope.cutevt = function () {
                //implement your cusotm functionality.
                alert("Cut event fired");
            };
            $scope.pasteval = "";
            $scope.pasteevt = function () {
                //implement your cusotm functionality.
                alert("Paste event fired");
            };
        });
    </script>
</body>
</html>






comments powered by Disqus


Search dotnetlearners.com