Angular 2 Ionic 2 - 如何將日期輸入的最大或最小日期設置為今天？

Question

 <input class="alert-input date-input" #dob="ngModel" name="dob" max="2018-03-07" [(ngModel)]="leadDetail.dob" type="date"></div>

如何動態設置今天的最大日期而不是2018-03-07？

我試過以下方法 -

 <input  max="today" type="date"></div>
 <input  max="{{today | date:'yyyy-mm-dd'}}" type="date"></div>

課程 -

public today = new Date();

但沒有運氣。

Answer 1

嘗試這個：

<input class="alert-input date-input" name="dob" [max]="today" type="date">


today = new Date().toJSON().split('T')[0];

工作示例演示

原因：

當您使用new Date()這將為您提供時區和時間等的完整日期，您必須僅指定日期，因此您必須將其與僅日期分開。 為了更多的工作，運行這個

console.log(new Date(), '----', new Date().toJSON());

Answer 2

將mm更改為MM然后格式但這將影響您更改的日期，這將無助於除非其ngModel綁定到另一個變量

Answer 3

如果輸入日期大於當前日期，則將禁用提交按鈕

register.component.html

<div class="container">
<form #loginForm="ngForm" (ngSubmit)="submitLoginForm(loginForm)" style="background-  color:beige;">
<input [(ngModel)]="vdate"  name="dob"  type="date">

<button type="submit" [disabled]="!loginForm.valid || (today < vdate)" class="btn">Login</button>

</form>

</div>

register.component.ts

import { Component, OnInit } from '@angular/core';

@Component({
selector: 'app-register',
templateUrl: './register.component.html',
styleUrls: ['./register.component.css']
})
export class RegisterComponent implements OnInit {
vdate: Date
today = new Date().toJSON().split('T')[0];
constructor() {

}

ngOnInit() {

}
submitLoginForm() {
console.log("Welcome to Jollywood")
}
}