使用Jhipster

Question

我的JHipster生成器版本是：generator-jhipster 2.27.1

我正在使用show-validation进行表单验证。除了以下情况外，一切似乎都正常。

1. 假设我有一个required的文本字段。
2. 输入一个字符，字段变为有效。
3. 删除文本，字段变为无效，出现错误消息，输入的表单组变为红色。
4. 现在重新输入文字。字段变为有效且错误消息消失，但是 表单组上的has-error类尚未删除。表格组仍然保持红色。
5. 当你继续进入 第二个字符，has-error现已删除。

这是来自 form.directive.js

的相关代码

$inputs.each(function() {
    var $input = $(this);
    scope.$watch(function() {                               
       return $input.hasClass('ng-invalid') && $input.hasClass('ng-dirty');
    }, function(isInvalid) {
       $formGroup.toggleClass('has-error', isInvalid);
    }); 
}

表单验证指令不是立即更新，而是由一个输入更改后面。我无法弄清楚代码的哪一部分需要修改。

添加了控制台日志，但无济于事。我认为它与文本值相对于模型值有关，但不知道如何解决它。

Answer 1

这个怎么样？

（添加：attrs，formCtrl attr链接功能并更改$ watch.function - 如果需要，取消注释脏检查）

            link: function (scope, element, attrs, formCtrl) {
            element.find('.form-group').each(function() {
                var $formGroup = $(this);
                var $inputs = $formGroup.find('input[ng-model],textarea[ng-model],select[ng-model]');

                if ($inputs.length > 0) {
                    $inputs.each(function() {
                        var $input = $(this);
                        scope.$watch(function() {
                            //inputs need to have 'name' attribute for this to work
                            return formCtrl[$input[0].name].$invalid;
                           //&& formCtrl[$input[0].name].$dirty;
                        }, function(isInvalid) {
                            $formGroup.toggleClass('has-error', isInvalid);
                        });
                    });
                }
            });
        }