AngularJS ng-cut Directive
The ng-cut Directive in AngularJS is used to specify the custom behavior functions when the text in input fields is cut. It can be used when we want to call a function that will be triggered when the text is cut from the input field. It is supported by all input elements.
Syntax:
<element ng-cut="expression"> Contents... </element>
Parameter:
- expression: It specifies what to do when the input is cut.
Example 1: This example uses the ng-cut Directive to display a message when cutting the input text element.
HTML
<!DOCTYPE html>
< html >
< head >
< title >ng-cut Directive</ title >
< script src =
</ script >
< style >
body {
text-align: center;
font-family: sans-serif;
}
h1 {
color: green;
}
</ style >
</ head >
< body ng-app style = "text-align:center" >
< h1 >GeeksforGeeks</ h1 >
< h3 >ng-cut Directive</ h3 >
< div ng-init = "iscut=false;cut='Cut this text!'" >
< textarea ng-cut = "iscut=true" ng-model = "cut" >
</ textarea >< br >
< pre >Cut status: {{iscut}}</ pre >
</ div >
</ body >
</ html >
|
Output:
Example 2: This example implements the ng-cut Directive to display the number of times the message cuts from the input text element.
HTML
<!DOCTYPE html>
< html >
< head >
< title >ng-cut Directive</ title >
< script src =
</ script >
< style >
body {
text-align: center;
font-family: sans-serif;
}
h1 {
color: green;
}
</ style >
</ head >
< body ng-app = "" >
< h1 >GeeksforGeeks</ h1 >
< h3 >ng-cut Directive</ h3 >
< p >Cut the "GeeksforGeeks" text</ p >
< input ng-cut = "cut = cut + 1"
ng-init = "cut=0"
value = "GeeksforGeeks" />
< p > {{cut}} times text cut.</ p >
</ body >
</ html >
|
Output:
Last Updated :
08 Aug, 2022
Like Article
Save Article
Share your thoughts in the comments
Please Login to comment...