Edit in JSFiddle

var myApp = angular.module("myApp", ["aa.formExtensions", "aa.notify", "aa.select2"]);

myApp.controller("myCtrl1", ['$scope', function ($scope) {
    $scope.urls = [
        "https://www.google.com",
        "https://www.yahoo.com"];
}]);

<script src="https://rawgit.com/AngularAgility/AngularAgility/master/dist/angular-agility.js"></script>
<div ng-app="myApp">
    <div aa-notify style="position: fixed; bottom: 10px; right: 10px; z-index:1000;"></div>
    <div class="container" ng-controller="myCtrl1">
        <div ng-form="exampleForm" class="form-horizontal">
            <div ng-repeat="url in urls" ng-form="urlForm">
                <input type="url" class="form-control" name="url" ng-model="url" aa-field-name="URL" aa-val-msg required/>
            </div>
        </div>
    </div>
</div>

input.ng-dirty.ng-valid, select.ng-dirty.ng-valid {
    border: 1px solid Green;
}
input.ng-dirty.ng-invalid, select.ng-dirty.ng-invalid, input.ng-invalid.aa-invalid-attempt, select.ng-invalid.aa-invalid-attempt, input.ng-invalid.aa-had-focus, select.ng-invalid.aa-had-focus, input.explicit-add-error, select.explicit-add-error {
    border: 1px solid Red;
}
div.validation-icons {
    margin-left: -40px;
    margin-top: 5px;
}
div.validation-icons i.fa-check {
    color: green;
}
div.validation-icons i.fa-exclamation-circle {
    color: red;
}
div.validation-error {
    color: red;
    font-weight: bold;
    text-align: left;
    width: 300px;
}