时间戳

首页 > 解决方案 > 角度输入类型日期时间本地验证

javascript - 角度输入类型日期时间本地验证

问题描述

在我用于日期时间选择的角度应用程序中，我使用输入类型 =“datetime-local”。

 <input id="field_bookingTime" type="datetime-local" class="form-control" name="bookingTime" [(ngModel)]="bookingTime"
   required/>

现在我需要禁用当前日期之前的日期和当前日期后 3 天的日期。例如对于 min，我添加了如下所示的验证。但是验证不起作用，仍然在显示的日历中启用了以前的日期。

currentDate = new Date();

     <input [min]="currentDate" id="field_bookingTime" type="datetime-local" class="form-control" name="bookingTime" [(ngModel)]="bookingTime"
       required/>

标签： javascriptangular

解决方案

我建议为表单控件编写一个自定义验证器。最小值和最大值的浏览器支持不好，但这也适用于本地日期时间。

    function dateValidator(c: FormControl) {
        // Not sure if c will come in as a date or if we have to convert is somehow
        const today = new Date();
        if(c.value > today) {
            return null;
        } else {
            return {dateValidator: {valid: false}};
        }
    }
    ...
    myForm = this.formBuilder.group({
        date: ['', dateValidator]
    })
    ...

推荐阅读