javascript - Does AngularJS store a value in the $error.maxlength object? -

i've got ui page setup through angular, , i'm trying take advantage of built in ng-maxlength validator on input element. long story short, know $scope.form.$error , how object has maxlength property in case validation fails. want display error message specific character length violated, , don't see anywhere length specified stored on object. know if it's possible access this, don't have write out separate error message each input has max length violated?

edit: answer question, yes angular store boolean value in $error object accessible via key(s) set in object. in case of code provided below , in th jsfiddle, setting key angular, , value of either true or false.

be mindful when setting value reversed. ex. $setvalidity( true ), flips $error false.

ok, here think looking for...

in angularjs v1.2.13 not have access ng-message or $validator pipeline, why are using $formatters , $parsers.

in case, using named inputs, perhaps in case need dynamic input names?

plus, if using inputs no form, getting error message display have done separate custom directive.

if so, please here dynamically named input fields help.

dynamic input name in angularjs link

let me know if works; i'll make changes needed hook up!

in case don't know, can write on angular's maxlength each individual input.

if changed 'maxlength' in updatevalidity() function in directive below, 'butter', $scope.form.inputname.$error

$scope.formname.inputname.$error { butter: true }  if used ng-maxlength="true", $scope.formname.inputname.$error { butter: true, maxlength: true }  example if used ng-maxlength, , capitalized 'maxlength' in directive 'maxlength'   $scope.formname.inputname.$error { maxlength: true(angular maxlength), maxlength: true(your maxlength)  , of course if name same, yours writes on angulars $scope.formname.inputname.$error { maxlength: true }; 

the point can add own names angular $error object; can write on angular's; , can use angular gives when use angular's directives: ng-required="true", or ng-maxlength="true"

link angularjs version on jsfiddle jsfiddle link

<div ng-app="myapp">   <form name="myform">     <div ng-controller="myctrl">       <br>       <label>input #1</label>       <br>       <input ng-model="field.myname" name='myname' my-custom-length="8" />       <span ng-show="myform.myname.$error.maxlength">         max length exceeded {{ myform.myname.maxlength }}       </span>       <br>       <br>       <label>input #2</label>       <br>       <input ng-model="field.myemail" name='myemail' my-custom-length="3" />       <span ng-show="myform.myemail.$error.maxlength">         max length exceeded {{ myform.myemail.maxlength }}       </span>     </div>   </form> </div>   var app = angular.module('myapp', []);  app.controller('myctrl', function ($scope) {   $scope.field = {}; });  app.directive("mycustomlength", function () {    return {     restrict: 'a',     require: 'ngmodel',      link: function (scope, element, attrs, ctrl) {       if (!ctrl) { return } // ignore if no ngmodel controller        ctrl.$formatters.push(validateinput);       ctrl.$parsers.unshift(validateinput);        function validateinput(value) {         if (!value) {           updatevalidity(false);           return;         }         inputlength(value);         var state = value.length > attrs.mycustomlength;         updatevalidity(state);       }        function inputlength(value) {         ctrl.maxlength = null;         var length = value.length > attrs.mycustomlength;         if (length) {           ctrl.maxlength = (value.length - attrs.mycustomlength).tostring();         }       }        function updatevalidity(state) {         ctrl.$setvalidity('maxlength', !state);       }     } // end link   } // end return }); 

css here if need it.

input.ng-invalid {   border: 3px solid red !important; }