Ng-Form-5

 

In this example there are three input fields created for array of object using ng-repeat directive and these are required but value of third object is empty so that it show error "Above field is required!" if either of three field will empty.

 
 
 
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.2/angular.min.js"></script> </head> <body ng-app="app"> <div ng-controller="controllerName"> <form name="parentForm"> <div ng-repeat="item in items"> <ng-form name="child"> Tag Name: <input name="name" ng-model="item.name" required> <div style="color:red" ng-if="child.name.$invalid">Above field is required!</div> </ng-form> </div> </form> </div> <script> var app = angular.module("app", []); app.controller('controllerName', ['$scope', function ($scope) { $scope.items = [{ name: 'A' }, { name: 'B' }, { name: '' }] }]); </script> </body> </html>
Output