Share.. Ask.. Learn..
Pages
Home
AngularJs Keywords
AngularJS
AngularJS Question & Answer
Angular 2
About Us
Contact Us
Sunday, 10 January 2016
AngularJs directive for only integer input in a textbox /input type text
Description:
AngularJs directive for only integer input can use to restrict the value other than Integer.So only integer value is allowed where this directive is given.This AngularJs directive use as class/attribute, follow angularjs example given below.
AngularJs directive for Integer Number:
angular.module('
webapp
',[]).directive(
'OnlyIntegerValue'
,
function
() {
return
{
restrict:
'CA'
,
require:
'?ngModel'
,
link:
function
(scope, element, attrs, ngModelCtrl) {
if
(!ngModelCtrl) {
return
;
}
ngModelCtrl.$parsers.push(
function
(value) {
var
vaildValue = val.replace(
/[^0-9]+/g
,
''
);
if
(value !== clean) {
ngModelCtrl.$setViewValue(vaildValue);
ngModelCtrl.$render();
}
return
vaildValue;
});
element.bind(
'keypress'
,
function
(event) {
if
(event.keyCode === 32) {
event.preventDefault();
}
});
}
};
How to Use Only Integer Directive:
Example 1:
<
div
ng-app
="webapp">
<
div
ng-controller
="angularjsexampleCtlr"
>
<
div
>
Angularjs Example of Integer Only Directive as attribute
<
label
>No of Months in a Year</
label>
<
input
type
="text"
only-integer-value
/>
</
div
>
</
div
>
</
div
>
Example 2:
<
div
ng-app
="webapp">
<
div
ng-controller
="angularjsexampleCtlr">
<
div
>
Angularjs Example of Integer Only Directive as class
<
label
>No of Months in a Year</
label>
<
input
type
="text"
class
="only-integer-value"
/>
</
div
>
</
div
>
</
div
>
No comments :
Post a Comment
Newer Post
Older Post
Home
Subscribe to:
Post Comments ( Atom )
No comments :
Post a Comment