ng-minlength, ng-maxlength and ng-required in AngularJs

<!DOCTYPE html>
<html>

<head>
     <link rel="stylesheet" href="style.css">
     <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.2/angular.min.js"></script>
     <script>
          var app = angular.module("myApp", []);
          app.controller('myCtrl', function($scope) {
               $scope.user = {
                    name: {
                         required: true,
                         minlength: 5,
                         maxlength: 25
                    }
               }
          });
     </script>
</head>

<body ng-app="myApp" ng-controller="myCtrl">
     <div>
          <h3>Use of ng-minlength, ng-maxlength and ng-required in AngularJs</h3></div>
     <form name="form">
          User Name *
          <input type="text" name="name" ng-model="name" ng-minlength='{{user.name.minlength}}' ng-maxlength="{{user.name.maxlength}}" ng-required='user.name.required' />
          <span ng-show="form.name.$dirty && form.name.$error.required">Name is required!</span>
          <span ng-show="form.name.$error.minlength">Input is too short!</span>
          <span ng-show="form.name.$error.maxlength">Input is too long!</span>
     </form>
               <div>
                <br><a href="http://www.code-sample.com/2014/09/angularjs-documentation.html">Click for more detail</a>
        </div>
</body>

</html>

// Code goes here

/* Styles go here */

input[type="text"] {
     width: 220px;height:24px;
     border: 1px solid #3255cc;
     border-right: 10px solid #3255cc;
}

.ng-dirty.ng-invalid {
     border-color: red !important;
}

span {
     color: red;
     font-size: 15px;
}