Javascript 防止用户输入未来日期4

我有一个dateOfBirth对象，我用MomentJS创建了一个今天日期的对象 但当我比较它们时，即使输入的日期小于今天的日期，它也会给我一个错误

这是我的html文件

<div class="form-group datepicker">
      <label for="dob">Date of Birth*</label>
      <div class="row input-group">
        <input
          ngbDatepicker
          #d="ngbDatepicker"
          #dobF="ngModel"
          class="form-control input-underline input-lg"
          id="dob"
          [(ngModel)]="dateOfBirth"
          placeholder="yyyy-mm-dd"
          name="dp"
          [ngClass]="{
            invalid:
              (dobF.value === null || isString(dobF.value) || (dateOfBirth.year > dobYear || dateOfBirth.month > dobMonth || dateOfBirth.day > dobDay) ) && dobF.touched
          }"
          required
        />
        <div class="input-group-append">
          <button
            class="btn btn-outline-secondary calendar"
            (click)="d.toggle()"
            type="button"
          ></button>
        </div>
      </div>
      <div
        *ngIf="
          (dobF.value === null || isString(dobF.value)  || dateOfBirth.year > dobYear || dateOfBirth.month > dobMonth || dateOfBirth.day > dobDay ) && dobF.touched
        "
        class="error"
      >
        Please enter a valid date of birth.
      </div>
    </div>

---

它给了我一个错误，因为今天的月份是02，所以当我输入2012-09-09时，它给了我一个错误，因为02使用

[max]

阻止用户输入未来的日期。没有必要自己构建这个验证器

见：

HTML:

---

使用

[max]

防止用户输入未来日期。没有必要自己构建这个验证器

见：

HTML:

---

当然，这里的解决方案就是简单地使用

Date

对象。您可以直接比较它们，而无需解析它们，并使用带有自定义验证器的反应式表单，这也将允许您在输入正确日期之前使表单无效

但是，如果您想保持当前逻辑，则需要检查年份是否错误，年份是否正确但月份是否错误，年份和月份是否正确但日期是否错误。它会变得非常难以辨认：

(dobF.value === null || isString(dobF.value)  || dateOfBirth.year > dobYear || (dateOfBirth.year == dobYear && dateOfBirth.month > dobMonth) || (dateOfBirth.year == dobYear && dateOfBirth.month == dobMonth && dateOfBirth.day > dobDay) ) && dobF.touched

---

当然，这里的解决方案就是简单地使用

Date

对象。您可以直接比较它们，而无需解析它们，并使用带有自定义验证器的反应式表单，这也将允许您在输入正确日期之前使表单无效

但是，如果您想保持当前逻辑，则需要检查年份是否错误，年份是否正确但月份是否错误，年份和月份是否正确但日期是否错误。它会变得非常难以辨认：

(dobF.value === null || isString(dobF.value)  || dateOfBirth.year > dobYear || (dateOfBirth.year == dobYear && dateOfBirth.month > dobMonth) || (dateOfBirth.year == dobYear && dateOfBirth.month == dobMonth && dateOfBirth.day > dobDay) ) && dobF.touched

---

我的建议如下

由于您使用的是日期选择器，请禁用输入字段（将其标记为只读）

设置[maxDate]=“maxDate”（今天是您可以通过下面的代码获得的当前日期）

---

我的建议如下

由于您使用的是日期选择器，请禁用输入字段（将其标记为只读）

设置[maxDate]=“maxDate”（今天是您可以通过下面的代码获得的当前日期）

---

事实上，我更喜欢Stefan的答案，你可以使用内置的HTML验证和

max

。工作起来很有魅力感谢上帝保佑你：）@Will Alexander我必须说Stefan的答案很好。如果您使用

new Date（）

而不是

moment.js

对象，它将起作用。它不起作用，它接受未来的日期，不给出任何错误。我实际上更喜欢Stefan的答案，你可以在

max

中使用内置的HTML验证。工作起来很有魅力谢谢上帝保佑你：）@Will AlexanderI必须说Stefan的答案是优秀的。如果您使用

new Date（）

而不是

moment.js

对象，它将起作用。它不起作用，它接受未来的日期并且不给出任何错误。它不起作用。我做了很多次。当我写未来日期的时候，它不会做任何事情，也不会接受它。我正在使用它，我可以向你保证，它是有效的。也许你提供的是一个时刻数据对象而不是实际日期对象。我做的和stefan完全一样，但没有工作。有没有其他的实现@Stefan是否进行过验证工作（例如，在需要时）？它不起作用。我做了很多次。当我写未来日期的时候，它不会做任何事情，也不会接受它。我正在使用它，我可以向你保证，它是有效的。也许你提供的是一个时刻数据对象而不是实际日期对象。我做的和stefan完全一样，但没有工作。有没有其他的实现@Stefan您的验证工作是否完成（例如，是否需要）？

public maxDate = new Date()

(dobF.value === null || isString(dobF.value)  || dateOfBirth.year > dobYear || (dateOfBirth.year == dobYear && dateOfBirth.month > dobMonth) || (dateOfBirth.year == dobYear && dateOfBirth.month == dobMonth && dateOfBirth.day > dobDay) ) && dobF.touched

 import * as moment from "moment";

 **Declare:-** 

 maxDate: {};
  today = new Date();

constructor(){
    this.maxDate = {
      year: parseInt(moment(this.today).format('YYYY')),
      month: parseInt(moment(this.today).format('MM')),
      day: parseInt(moment(this.today).format('DD')),
    }
}