Javascript 如何阻止用户在angular中的日期类型输入中键入未来日期

我已经限制用户使用HTML5日期选择器在输入中输入将来的日期。但用户可以输入未来的日期。如果用户不选择从日期选择器日历中选择日期值，是否有任何方法阻止用户键入未来的日期

这是我的密码：

HTML

  <div class="col-sm-7">

    <input type="date" class="form-control" [max]="maxDate" pattern="^(19[5-9][0-9]|20[0-4][0-9]|2050)[-/](0?[1-9]|1[0-2])[-/](0?[1-9]|[12][0-9]|3[01])$" name="Datebillabuse" [(ngModel)]="Datebillabuse" #date="ngModel" [ngClass]="{ 'is-invalid': f.submitted && date.invalid }" required />
    <div *ngIf="f.submitted && date.invalid" class="invalid-feedback">
        <div *ngIf="date.errors.required">Date is required</div>
        <div *ngIf="date.errors.pattern">Please enter a valid date</div>
        <div *ngIf='date.errors.max'>Date must not be in future</div>
    </div>
  </div>

日期是必需的
请输入有效日期
日期不能在将来

TypeScript

  setTodayDate() {

    const dtToday = new Date();
    let month = String(dtToday.getMonth() + 1);
    let day = String(dtToday.getDate());
    let year = dtToday.getFullYear();


    if (parseInt(month, 10) < 10) {
        month = '0' + month.toString();
    }
    if (parseInt(day, 10) < 10) {
        day = '0' + day.toString();
    }

     this.maxDate = `${year}-${month}-${day}`;

  }

setTodayDate（）{
const dtToday=新日期（）；
让month=String（dtToday.getMonth（）+1）；
let day=String（dtToday.getDate（））；
让year=dtToday.getFullYear（）；
if（parseInt（月，10）<10）{
month='0'+month.toString（）；
}
如果（第10天）{
day='0'+day.toString（）；
}
this.maxDate=`${year}-${month}-${day}`；
}

我想到的一个解决方案是检查日期值是否大于今天，并显示错误

---

有没有更好的方法来解决这个问题？

当我们通过设置“最大值”属性来限制用户时，html输入类型日期元素有一个问题，因为这不允许用户从日历下拉列表中选择日期，但用户仍然可以使用键盘输入不需要的值。这就是黑客，我曾经处理过这个问题

声明一个布尔值以检查日期是否无效

futureDateError：布尔值

声明一个方法以检查输入日期是否有效

checkDateValidity（日期：字符串）：布尔值 {

}

将此方法与

（更改）

事件绑定

当日期无效且不提交表单时显示错误

日期不能在将来 if（this.checkDateValidity（this.dateBill））{ 返回； }

    const mxDate = new Date(this.maxDate);
    const inputDate = new Date(date);

    if (inputDate > mxDate) {
      return this.futureDateError = true;
    }
    return this.futureDateError = false;