Has Error Directive

has-error.directive.js

(function() {
    'use strict';

    angular
        .module('app')
        .directive('hasError', function($timeout) {
            return {
                restrict: 'A',
                require: '^form',
                link: function(scope, iElement, iAttrs, formCtrl) {
                    $timeout(function() {
                        var inputName = iElement.find('[name]')
                            .attr('name'),
                            // support to sub forms
                            mainForm = _.isUndefined(formCtrl.$$parentForm.$submitted) ? formCtrl : formCtrl.$$parentForm;

                        if (!_.isUndefined(inputName) && formCtrl[inputName]) {
                            scope.$watch(function() {
                                if (formCtrl[inputName]) {
                                    return (mainForm.$submitted || formCtrl[inputName].$dirty) && formCtrl[inputName].$invalid;
                                }
                                return false;
                            }, function(invalid) {
                                iElement.toggleClass('has-error', invalid);
                            });
                        }
                    });
                }
            };
        });

}());