当另一个字段发生变化时触发字段的验证

PFr*_*ise 29 javascript validation angularjs

我有一个自定义验证指令,当一个字段被更改时,该指令被正确调用.但是,此字段是否有效也基于另一个字段的值.如果这是重要的,则该第二个字段是选择列表.

我想知道是否有某些方法可以在第二个表单更改时手动触发验证.也许通过使用该ng-change事件.处理这样的事情的正确方法是什么?

这是我的指示:

angular.module('myApp', []).
    directive('validage', function () {
        return {
            require: 'ngModel',
            link: function (scope, elem, attr, ngModel) {

                function validate(value) {
                    var valid = true;
                    if ((GetDateDifference(new Date(value), new Date()) < 16 || GetDateDifference(new Date(value), new Date()) > 129)
                    && scope.dep.DependantType == "Spouse") {
                        valid = false;
                    }
                    ngModel.$setValidity('validage', valid);
                    return value;
                }

                //For DOM -> model validation
                ngModel.$parsers.unshift(function (value) {
                    var valid = true;
                    if ((GetDateDifference(new Date(value), new Date()) < 16 || GetDateDifference(new Date(value), new Date()) > 129)
                    && scope.dep.DependantType == "Spouse") {
                        valid = false;
                    }
                    ngModel.$setValidity('validage', valid);
                    return value;
                });

                //For model -> DOM validation
                ngModel.$formatters.unshift(function (value) {
                    var valid = true;
                    if ((GetDateDifference(new Date(value), new Date()) < 16 || GetDateDifference(new Date(value), new Date()) > 129)
                    && scope.dep.DependantType == "Spouse") {
                        valid = false;
                    }
                    ngModel.$setValidity('validage', valid);
                    return value;
                });
            }
        };
    });
Run Code Online (Sandbox Code Playgroud)

如果您是AngularJS的新手,我肯定会推荐阅读这两篇文章:第1 部分第2部分.它们是AngularJS表单的概述.

gne*_*eri 49

经过大量搜索后我发现只需调用$validate()所需的字段即可触发验证.
因此,例如,如果您的表单名为my_form(即在标记中,表单标记具有name="my_form"属性),并且您要验证的字段的名称是日期(在标记中输入字段具有name="date"属性),那么就像您建议的那样可以使用第二个字段的ng-change事件,并在调用ng-change函数时调用.$scope.my_form.date.$validate();

  • 谢谢!这也可以通过调用ngModel在指令中工作.$ validate(); ..例如,如果你有你观察到的属性,你可以重新验证模型:) (9认同)
  • 您可以在 html 中正确执行此操作:`ng-change="my_form.date.$validate()"` (2认同)

PFr*_*ise 0

我最终将指令添加到第二个字段,然后更改指令以将错误消息添加到有错误的字段。可能有更好的方法,但这就是我最终所做的。