ion datetime在ionic2/ionic3中,我希望弹出对话框显示当前日期,但ion datetime不显示当前日期
我正在使用ion datetime在ionic2/ionic3中,我希望弹出对话框显示当前日期,但ion datetime不显示当前日期,datetime,ionic-framework,ionic2,ionic3,Datetime,Ionic Framework,Ionic2,Ionic3,我正在使用 <ion-datetime displayFormat="MM/DD/YYYY" [(ngModel)]="someVar"></ion-datetime>. 。 但是如果我将今天的日期设置为变量,那么它将默认显示该值。我只需要显示选定日期。这不是一个正式的解决方案,而是一个更好的解决方案 这里有工作 HTML: <ion-list> <ion-item> <ion-label color="primar
<ion-datetime displayFormat="MM/DD/YYYY" [(ngModel)]="someVar"></ion-datetime>.
。
但是如果我将今天的日期设置为变量,那么它将默认显示该值。我只需要显示选定日期。这不是一个正式的解决方案,而是一个更好的解决方案 这里有工作 HTML:
<ion-list>
<ion-item>
<ion-label color="primary">Select Date</ion-label>
<ion-input placeholder="Text Input" [value]="dataInicial | date:'dd/MM/yyyy'" (click)="open()"></ion-input>
</ion-item>
<ion-item no-lines hidden="true">
<ion-datetime #datePicker displayFormat="DD/MM/YYYY" (ionCancel)="this.dataInicial = null" [(ngModel)]="dataInicial" doneText="Feito" cancelText="Cancelar" [max]="maxDate">
</ion-datetime>
</ion-item>
</ion-list>
import { Component, ViewChild } from '@angular/core';
import { NavController } from 'ionic-angular';
@Component({
selector: 'page-home',
templateUrl: 'app/home.page.html'
})
export class HomePage {
appName = 'Ionic App';
dataInicial: Date;
maxDate: string;
constructor(public neavController: NavController) {}
@ViewChild('datePicker') datePicker;
open() {
if (!this.dataInicial) {
this.dataInicial = new Date().toJSON().split('T')[0];
setTimeout(() => {
this.datePicker.open();
}, 50)
} else {
this.datePicker.open();
}
}
}
xxx.html
<ion-datetime #changeTime displayFormat="YYYY-MM-DD"
[(ngModel)]="changeDate"
(ionChange)="handleChangeDate(changeDate)"</ion-datetime>
请看这里:
如果您使用的是Ionic 3.7或更高版本,他们会在Ionion dateime
元素上添加一个功能来设置initialValue
。(万岁!谢谢你)
例如:
<ion-datetime displayFormat="MM/DD/YYYY" formControlName="someDateControl" (initialValue)="10/01/2017"></ion-datetime>
这会根据用户的位置将ion datetime
最小值默认为今天的日期,但在实际选择并提交日期之前,该字段保持空白。如果要自动将其设置为1个月或类似的时间,只需调整dateFunction 2021年
离子5
仍然不是一个正式的解决方案,因此我将着手解决:
在组件代码中声明一个变量,如intialDate,并将其初始化为空字符串“”
在模板标记中,将intialDate设置为[(ngModel)],并向(tap)事件添加事件处理程序
在(tap)事件处理程序的组件代码中,将intialDate设置为希望datetime打开的日期(检查状态并相应地应用逻辑)
自行处理ionCancel事件,并根据状态和应用程序逻辑重置所有内容
xxx.html
<ion-datetime #changeTime displayFormat="YYYY-MM-DD"
[(ngModel)]="changeDate"
(ionChange)="handleChangeDate(changeDate)"</ion-datetime>
xxx.ts
@ViewChild('changeTime') changeDateTime: DateTime;
changeDate = '';
constructor() {
let datePipe = new DatePipe('en-US');
this.changeDate = datePipe.transform(new Date(), 'yyyy-MM-dd');
}
ionViewDidLoad() {
this.changeDateTime.updateText = () => {};
}
handleChangeDate(changeDate: string) {
this.changeDate = changeDate;
this.changeDateTime._text = changeDate;
}
dateFocus(obj){if(!obj.value){obj.value=newdate(this.currentDate).toISOString();}}
您能显示ts
文件代码吗?主代码是someVar=newdate().toISOString()代码>谢谢你的回复,但我希望弹出对话框显示当前日期,但离子日期不显示,它只显示选中的日期。是的,谢谢。我看到了。我也找到了答案,但它不能满足我的需要。这对我不起作用。这对你有用吗?我们可以要一个plunker
或stackblitz
?很好用!谢谢我在3.12上,这是不存在的。