Tutorials References Exercises Bootcamp Menu
Sign Up Create Website Get Certified Pro

AngularJS ng-maxlength Directive


Display an error if the input value is longer than five characters:

<form name="myForm">

<input name="myInput" ng-model="myInput" ng-maxlength="5">

<h1 ng-if="!myForm.myInput.$valid">The value is too long</h1>

Try it Yourself »

Definition and Usage

The ng-maxlength directive adds a restriction to an input field, and to the validator of the form.

The ng-maxlength is not the same as the maxlength attribute in HTML, which will prevent users from typing more than the restricted number of characters.

The ng-maxlength directive will not prevent users from typing more than the restricted number off characters, but the form will be invalid if they do so.


<input type="text" ng-maxlength="number"></input>

Mainly supported by <input> elements of type text, but can also be used on other elements that allows user input.

Parameter Values

Value Description
number A number representing the maximum number of characters legal for the input field.