Text Input Allow Only Integer Input in Angularjs

var numInput = document.querySelector('input');
numInput.addEventListener('input', function(){    var num = this.value.match(/^\d+$/);    if (num === null) {      this.value = "";    }});

<input type="number" min="0" step="1"/>

angularjs: allows only numbers to be typed into a text box

This functionality just what you need. http://docs.angularjs.org/api/ng.directive:input.number

EDIT:

You can wrap the jquery plugin into directive. I created an example here: http://jsfiddle.net/anazimok/jTJCF/

HTML:

<div ng-app="myApp">
    <div>
        <input type="text" min="0" max="99" number-mask="" ng-model="message">
            <button ng-click="handleClick()">Broadcast</button>
    </div>

</div>

CSS:

.ng-invalid {
    border: 1px solid red;
}

JS:

// declare a module
var app = angular.module('myApp', []);

app.directive('numberMask', function() {
    return {
        restrict: 'A',
        link: function(scope, element, attrs) {
            $(element).numeric();
        }
    }
});

How do I restrict an input to only accept numbers?

Easy way, use type="number" if it works for your use case:

<input type="number" ng-model="myText" name="inputName">

Another easy way:
ng-pattern can also be used to define a regex that will limit what is allowed in the field. See also the "cookbook" page about forms.

Hackish? way, $watch the ng-model in your controller:

<input type="text"  ng-model="myText" name="inputName">

Controller:

$scope.$watch('myText', function() {
   // put numbersOnly() logic here, e.g.:
   if ($scope.myText  ... regex to look for ... ) {
      // strip out the non-numbers
   }
})

Best way, use a $parser in a directive.
I'm not going to repeat the already good answer provided by @pkozlowski.opensource, so here's the link: https://stackoverflow.com/a/14425022/215945

All of the above solutions involve using ng-model, which make finding this unnecessary.

Using ng-change will cause problems. See AngularJS - reset of $scope.value doesn't change value in template (random behavior)

how to allow only numbers in textbox in angularjs?

you need to add ng-pattern="/^(\d)+$/" in input field.

 <div class="col-md-6 col-sm-6"> 
 <label class="col-md-5 col-sm-5 pad-top5 pad-lft-no">Min <span class="error">*</span></label>
                                                    <input positive  type="number" class="col-md-7 col-sm-7 cls_input_inherit numberinput" min="0" ng-maxlength="3" id="age_min" name="age_min" ng-model="attributes.age_min" ng-pattern="/^(\d)+$/" required/>
                                                    <label for="age_min" ng-show="submittab2 && attributesForm2.age_min.$error.required && attributesForm2.age_min.$touched && attributesForm2.age_min.$invalid"  class="error">{{formValidation.required}}</label>                                                           
                                                    <label for="age_min" ng-show="submittab2 && !attributesForm2.age_min.$error.positive &&  attributesForm2.age_min.$error.maxlength" class="error"> {{formValidation.monthMaxChar}} </label>
                                                    <label for="age_min" ng-show="submittab2 && !attributesForm2.age_min.$error.positive && !attributesForm2.age_min.$error.maxlength && attributesForm2.age_min.$error.min" class="error">{{formValidation.minMax}}</label>
                                                    <label for="age_min" ng-show="submittab2 && !attributesForm2.age_min.$error.positive && !attributesForm2.age_min.$error.maxlength && attributesForm2.age_min.$error.number" class="error">{{formValidation.errorNumber}}</label>
                                                    <label for="age_min" ng-show="submittab2 && attributesForm2.age_min.$error.positive" class="error">{{formValidation.minpositive}}</label>
                                                </div>

How can I make input field accept INTEGERS only with AngularJS

Create a directive may be?

myApp.directive("myNumber", function() {
  return {
    restrict: "EA",
    template: "<input type='number' step='1' />",
    replace: true,
    link: function(scope, e, attrs) {    
      e.bind("keydown", function(e) {

        if (!(e.keyCode >= 48 && e.keyCode <= 57)) {
          e.preventDefault();
        }
      });
    }
  };
});

then use it in your app like so

<div ng-app="myApp">
 <my-number><my-number>
</div>

You can garnish it further to allow bindings, and special keys

myApp.directive("myNumber", function() {
  return {
    restrict: "EA",
    template: "<input type='text' ng-model='model' />",
    replace: true,
    scope: {model : "="},
    link: function(scope, e, attrs) {

      e.bind("keydown", function(e) {
        // Special request from @endless for all these keys to be exempted
        //
        if (e.ctrlKey || e.altKey || e.keyCode >= 0 && e.keyCode <= 31 || e.keyCode >= 33 && e.keyCode <= 40 || e.keyCode==46) {
          return;
        }
        else if (!(e.ctrlKey || (e.keyCode >= 48 && e.keyCode <= 57 && !e.shiftKey))) {
          e.preventDefault();
        }
      }).bind("change", function() {
         var e = angular.element(this);
         if (isNaN(parseInt(e.val())) || e.val().indexOf(".") >= 0) {
            alert("incorrect number value entered");
            e.val("");
         }
      });
    }
  };
});

Here is a working plunkr example

Here is another fork of the above that allows all the special keys

Here is more info on directives

How to allow only integer numbers in Angular?

function Main($scope) {
     $scope.regex = "/^-?[0-9][^\.]*$/";   }

input.ng-dirty.ng-invalid { color: red }

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script><div ng-app>    <div ng-controller="Main">        <form name="form">   <input type="number" ng-model="person.age" ng-pattern="/^-?[0-9][^\.]*$/"/>           <input type="number" ng-model="person.age1" ng-pattern="{{regex}}" />        </form>    </div></div>