Angular 2 Ionic 2 - 如何将日期输入的最大或最小日期设置为今天?

时间:2017-04-12 10:18:31

标签: javascript angular typescript ionic2

23

如何动态设置今天的最大日期而不是2018-03-07?

我尝试了以下方法 -

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

班级 -

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

但没有运气。

3 个答案:

答案 0 :(得分:12)

试试这个:

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


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

Working Example Demo

  

原因:

当您使用new Date()时,这将为您提供时区和时间等的完整日期,您必须仅指定日期,因此您必须仅使用日期将其拆分。 为了更多的神职人员,请运行此

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

答案 1 :(得分:0)

将mm更改为MM,然后更改格式,但这将影响您更改日期的时间,除非直到其ngModel绑定到另一个变量,否则这无济于事

答案 2 :(得分:0)

如果输入日期大于当前日期,则提交按钮将被禁用

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")
}
}