AngularJS - Form Validation

FormController, ng-show, ng-if, ng-model, ng-messages

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular-messages.min.js"></script>
<body translate="no">
  <button ng-click="checkall(formValidation)">check all</button>

  <body ng-app="app" ng-controller="myCtrl">
    <div ng-repeat="user in users">
      <script type="text/ng-template" id="generic-messages">
        <p ng-message="required">This field is required.</p>
    <p ng-message="minlength">This field is too short.</p>
    <p ng-message="maxlength">This field is too long.</p>
  </script>


      <form name="forms[{{$index}}]">
        <button ng-click="myFunc($index)">check {{$index}}</button>
        <label>Username (Using Dirty)</label>
        <input type="text" name="username" ng-model="user.inputName" ng-minlength="6" ng-maxlength="12" ng-pattern="/^\w+$/" required>
        <div ng-messages="formValidation.username.$error" ng-show="formValidation.username.$dirty">
          <p ng-message="pattern">Username can only be alphanumeric with an optional underscore.</p>
          <p ng-message="maxlength">Username cannot be longer than 12 characters.</p>
          <div ng-messages-include="generic-messages"></div>
        </div>

        <label>Password (Using Touched)</label>
        <input type="text" name="userPassword" ng-model="user.inputPassword" ng-minlength="6" ng-maxlength="12" required>
        <div ng-messages="formValidation.userPassword.$error" ng-show="formValidation.userPassword.$touched">
          <div ng-messages-include="generic-messages"></div>
        </div>

        <label>Email (Using Dirty)</label>
        <input type="email" name="userEmail" ng-model="user.inputEmail" required>
        <div ng-messages="formValidation.userEmail.$error" ng-show="formValidation.userEmail.$dirty">
          <p ng-message="required">This field is required.</p>
          <p ng-message="email">Please enter a valid email address.</p>
       ...

CSS

body {
  font-family: 'Lato';
  margin: 20px;
  font-weight: 400;
}

label {
  color: #555;
  font-weight: bold;
  margin-right: 10px;
  display: block;
}

input {
  border: 2px solid #2196F3;
  width: 300px;
  outline: none;
  padding: 4px;
  border-radius: 5px;
  margin: 5px 0 10px 0;
}

p {
  color: red;
  font-weight: bold;
  padding: 0;
  margin: 5px 0 40px 0;
}

JavaScript

var app = angular.module("app", ['ngMessages']);
app.controller("myCtrl", function($scope) {
    $scope.forms = [];
    $scope.users = [
        {
		"inputName":"aj",
		"inputPassword":"1234",
		"inputEmail":"aj@g.in",
		},{
		
		"inputName":"gj",
		"inputPassword":"1234",
		"inputEmail":"gj@g.in",
		}
    ];
	 $scope.myFunc = function(formIndex) {
        console.log(formIndex);
        console.log($scope.forms[formIndex]);
        
    };
	$scope.checkall = function(form) {
        console.log($scope.forms.length);
    };
});