How to only allow the numbers 0-5 in <input> fields with AngularJS?

Question

I have an input field like this:

HTML

Answer 1

You can use ngPattern to set the regular expression which you want to validate against.

Reffer to the docs for more details: https://docs.angularjs.org/api/ng/directive/input

Answer 2

You can add the following attribute to your input field.

ng-pattern="/^[0-5]+$/" 

And validate as such:

function formCtrl($scope) {

}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app ng-controller="formCtrl">
  <form name="myForm">
    <input type="number" ng-model="newtodo.effort" name="effort" ng-pattern="/^[0-5]$/" ng-enter="addTodo()" step="1" class="form-control marginBottom" placeholder="Aufwand" aria-describedby="basic-addon2" required>
    <span ng-show="myForm.effort.$error.pattern">The number must be between 0-5</span>
    <span ng-show="myForm.effort.$error.number">No characters allowed</span>
    <span ng-show="myForm.effort.$error.required && !myForm.effort.$error.number">The field is required</span>
  </form>
</div>