Angular 安装ionic 2日期选择器
我对离子2中的日期时间选择器有一些问题: 1。当我选择datetime时,存储它的变量是什么? 我从我的项目中添加代码,我只是尝试将其存储在一些变量中,但没有成功Angular 安装ionic 2日期选择器,angular,ionic-framework,ionic2,Angular,Ionic Framework,Ionic2,我对离子2中的日期时间选择器有一些问题: 1。当我选择datetime时,存储它的变量是什么? 我从我的项目中添加代码,我只是尝试将其存储在一些变量中,但没有成功 import { Component } from '@angular/core'; import { NavController } from 'ionic-angular'; import {DatePicker} from 'ionic-native'; import {Calendar} from 'ionic-native'
import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import {DatePicker} from 'ionic-native';
import {Calendar} from 'ionic-native';
import {Platform} from 'ionic-angular';
import { Pipe } from '@angular/core';
/*
Generated class for the InviteDates page.
See http://ionicframework.com/docs/v2/components/#navigation for more info on
Ionic pages and navigation.
*/
@Component({
selector: 'page-invite-dates',
templateUrl: 'invite-dates.html'
})
export class InviteDates {
dateshow:any;
newdate:any;
d:any;
b:any;
year:any;
month:any;
day:any;
today:Date;
mydate: String = new Date().toISOString();
constructor(public navCtrl: NavController,private platform:Platform) {
this.d="";
}
ionViewDidLoad() {
console.log('Hello InviteDates Page');
this.datefun();
}
}
html文件
<ion-content padding>
<ion-item>
<ion-label>Date</ion-label>
<ion-datetime displayFormat="DD/MM/YYYY" [(ngModel)]="mydate"></ion-datetime>
<p> the date is :{{mydate}}</p>
</ion-item>
</ion-content>
日期
日期为:{mydate}
在我的控制台中,我得到了这个消息“datetime对象”,所以我想declate datetime变量,但它显示了错误
2.我想要3个约会时间:
-#1当前日期的日期时间
-#2所选日期的日期时间
-#3用户选择的时间的日期时间
如何做到这一点?
3.我如何限制日期?我的意思是,用户无法从过去中选择,例如,从今天起仅一周。以下是我认为您想要实现的目标的最佳体现(格式和样式有限): 组成部分:
@Component({
selector: 'page-invite-dates',
templateUrl: 'invite-dates.html'
})
export class HomePage {
date1: string = new Date().toDateString();
date2: string;
min: string = '';
max: string = '';
constructor() {
let today = new Date();
let oneWeek = new Date();
oneWeek.setDate(oneWeek.getDate() + 7);
this.min = today.toISOString();
this.max = oneWeek.toISOString();
}
}
视图:
{{date1}}
日期
{{date2}}
有关ionic datepicker()的更多详细信息,请参阅API
请随意寻找为Angular 2构建的第三方组件,这取决于您的项目结构。通常你应该把它放到app.js中。你可以在这里发布你的项目结构,然后我可以给出更清晰的答案。你正在尝试将Ionic 1组件与Ionic 2一起使用。换句话说,你是在混合角度1和角度2。不要这样做。您应该使用Ionic 2s默认日期选择器()或查找角度2组件来use@Pat他在前面特别提出了一个关于如何不使用日期时间选择器的问题,所以这是一个后续问题
<ion-content>
<ion-item>
{{date1}}
</ion-item>
<ion-item>
<ion-label>Date</ion-label>
<ion-datetime min="{{min}}" max="{{max}}" displayFormat="MM/DD/YYYY" [(ngModel)]="date2"></ion-datetime>
</ion-item>
<ion-item>
{{date2}}
</ion-item>
</ion-content>