3

我在我的项目中使用 Valdr，我需要验证日期输入“startDate”是否在另一个日期输入“endDate”之前。

<input id="startDate" name="startDate" type="text" ng-model="project.startDate"/>
<input id="endDate" name="endDate" type="text" ng-model="project.endDate"/>

我知道，没有 Valdr，这个问题可以使用自定义指令来解决，如下所示：Directive for comparison two dates

我发现有点不清楚如何在 Valdr 上创建一个使用其他字段值的自定义验证器。

4

4 回答 4

1

答案很简短但令人不满意：valdr 目前不支持这一点。不过，GitHub 上有一个开放的功能请求。

于 2015-08-15T20:39:04.450 回答
0

实际上，您可以通过自定义验证器解决此问题，该验证器可以获取另一个字段并相互比较值。下面的代码使用 valdr-bean-validation 在服务器端生成 valodation.json。

如果你想在没有这个的情况下使用它，只需查看 JS 代码并手动在你的 validation.json 中添加验证器。

Java 注释（valdr 验证器的服务器端声明）：

package validation;
@Documented
@Retention(RetentionPolicy.RUNTIME)
@Target({ ElementType.METHOD, ElementType.FIELD, ElementType.CONSTRUCTOR,
        ElementType.PARAMETER, ElementType.ANNOTATION_TYPE })
public @interface DateFormat {

    String message();

    Class[] groups() default { };

    String beforeFieldName();
}

Java Bean（注解的使用，这个类必须在validation.json的生成中使用）：

package pojo;

import validation.DateFormat;

public class RegistrationPojo implements BasePojo {

    @NotNull(message = "message.date1.required")
    private Date date1;

    @NotNull(message = "message.date2.required")
    @DateFormat(message = "message.date2.date", beforeFieldName = "date1")
    private Date date2;

}

JS（自定义验证器的实现并在 valdr 中注册）：

module.factory('validation.DateFormat', [
    function () {
    return {
        name: 'validation.DateFormat',
        validate: function (value, constraint) {
            var minOk = true;
            var maxOk = true;
            var format = false; // constraint.pattern is mandatory
            //do not validate for required here, if date is null, date will return true (valid)

            console.log("my date validator called");
            console.log("    beforeFieldName: " + constraint.beforeFieldName);

            var field = document.querySelector('[name="' + constraint.beforeFieldName + '"]');
            console.log("field value: " + (field ? field.value : "null"));
            return (!field || value > field.value);
        }
    };
}]);

module.config([
    "valdrProvider", 
function(valdrProvider) {
    valdrProvider.addValidator('validation.DateFormat');
}]);
于 2016-09-20T09:25:09.953 回答
0

您可以使用此解决方案：

  1. 根据任何日期字段的变化计算一个布尔值 - 一个指示是否满足验证规则的值
  2. 创建一个简单的自定义验证器来检查该值是否为真
  3. 注册您的验证器并为该计算值添加约束
  4. 将该计算值的隐藏输入放置在您希望显示验证消息的任何位置
于 2018-03-10T20:20:17.820 回答
0

在 valdr 中实现该功能之前，您可以使用自己的验证器指令并使其与 valdr 对话。该指令可能需要一个“表格”，并且可以获取您要比较的日期模型的名称。然后你做你的逻辑来比较这两个值并设置适当的'ngModelController'的有效性。由于在为该模型设置有效性时需要提供错误，因此错误名称将是您与 valdr 的连接。

之后，您只需要在“valdrMessage”服务中映射错误：

.run(function (valdrMessage) {

valdrMessage.angularMessagesEnabled = true;

valdrMessage.addMessages({
  'date': 'Invalid date!'
});

});

Valdr 将像往常一样在无效字段下方显示消息。

于 2015-11-14T23:57:36.647 回答