如何設置輸入類型日期值的最大值=“變量值”

Question

無法將“今天的日期值轉換為輸入字段的“最大”屬性”，但能夠在控制台中獲取該值。

你們能幫助我如何在輸入字段中獲得價值（即max =“ 2018-08-21”）

var todayDate =
      new Date().getFullYear() +
      "-" +
      ("0" + (new Date().getMonth() + 1)).slice(-2) +
      "-" +
      ("0" + new Date().getDate()).slice(-2);
    console.log(todayDate, "here");

 <div class="input-group">
    <input type="date" max="todayDate" />
 </div>

Answer 1

當您使用Angular時，可以將max與date綁定為：

TS

todayDate = new Date().getFullYear() + "-" + ("0" + (new Date().getMonth() + 1)).slice(-2) + "-" + ("0" + new Date().getDate()).slice(-2);

HTML

<div class="input-group">
  <input type="date" [max]="todayDate" />
</div>

您可以在這里檢查stackblitz

Answer 2

使用[max]

export class AppComponent  {

  todayDate = new Date('2018-08-21')

}

<div class="input-group">
  <input type="date" [max]="todayDate | date:'yyyy-MM-dd'" />
</div>

Answer 3

由於沒有人向您提供Angular答案，而是依靠您的語言環境對其進行測試（這樣做很危險），因此這里是：一個自定義驗證器，它將檢查日期是否低於您提供給驗證器的日期。 這是一個stackblitz演示

驗證者：

export function notAfterToday(date: Date = new Date(Date.now())): ValidatorFn {
  return (control: AbstractControl): { [key: string]: any } | null => {
    const selectedDate = new Date(control.value);
    return selectedDate && !isNaN(selectedDate.getTime()) && selectedDate.getTime() > date.getTime() ? { 'dateTooHigh': true } : null;
  };