LearnKode

3 Example(s) of Ng-Cut


Description :

In this example we can set the value of isCut=true on ng-cut event(when we cut the text from textbox) and display it below.By default value of isCut variable is false which is set by ng-init directive.


Ng-Cut Example - 1 
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.2/angular.min.js"></script>
</head>
<body ng-app>
    <div ng-init="isCut=false; cutValue='Cut me !'">
        Cut here: <input ng-cut="isCut=true" ng-model="cutValue" /><br />
        <pre>Cut: {{isCut}}</pre>
    </div>
</body>
</html>
Try it » Download Example »

Output

Description :

In this example we can set the value of isCut=true on ng-cut event and display it below.By default value of isCut variable is false which is set by ng-init directive.


Ng-Cut Example - 2 
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.2/angular.min.js"></script>
</head>
<body ng-app>
    <div ng-init="isCut=false; cutValue='Cut me !'">
        Cut here: <textarea ng-cut="isCut=true" ng-model="cutValue"></textarea><br />
        <pre>Cut: {{isCut}}</pre>
    </div>
</body>
</html>
Try it » Download Example »

Output

Description :

In this exmple of Ng-Cut, We added a directive called ng-cut like:and user can't cut the code from input box. See the code


Ng-Cut Example - 3 
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.2/angular.min.js"></script>
</head>
<body ng-app="app">
    <div ng-controller="controllerName" ng-init="isPaste=false">
        <input ng-cut="cut($event)" ng-model="cpy" ng-keydown="kp($event)" />
    </div>
<script>
    var app = angular.module("app", []);
    app.controller('controllerName', ['$scope', function ($scope) {
        $scope.cpy = "Can not cut me!";
        $scope.cut = function ($event) {
            console.log('cut', $event);
            $event.preventDefault();
        };
    }]);
</script>
</body>
</html>
Try it » Download Example »

Output