AngularJS ng-invalid-maxlength

by JeremyBojkoDev

HTML

<script src="http://ci.angularjs.org/view/AngularJS/job/angular.js-angular-master/lastSuccessfulBuild/artifact/build/angular.min.js"></script>
<div ng-controller="MainController">
    <input ng-model="initialString1" type="text" ng-maxlength="3">
    <br>
    <input ng-model="initialNumber1" type="text" ng-maxlength="3">
    <br>
    <input ng-model="initialString2" type="number" ng-maxlength="3">
    <br>
    <input ng-model="initialNumber2" type="number" ng-maxlength="3">
</div>

CSS

input {
    outline: none;
    border: 1px solid black;
    margin-bottom: 10px;
}

.ng-valid-maxlength {
    border: 1px solid green;
}

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

JavaScript

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

app.controller("MainController", function ($scope) {
    $scope.initialString1 = "1";
    $scope.initialNumber1 = 1;
    
    $scope.initialString2 = "2";
    $scope.initialNumber2 = 2;
});