一、DateTime
DateTime组件是展示一个窗口让用户很方便的选择日期.使用ion-dateTime将会在页面底部显示一个滑动的选择日期窗口,这个选择器会展示出一个滑动的列来独立的选择年月日等等,这个组件很像原生的元素,但是,ionic的dateTime让你更简单的展示一个时间选择控件并管理这个值。
Date
二、显示和选择格式
1、YYYY 4位数年份
2、YY
3、M
4、MM
5、MMM 月份英文缩写
6、MMMM 月份英文全称
7、D
8、DD
9、DDD
10、DDDD
11、a 小写的am、pm
12、A 大写的am、pm
13、m
14、mm 前面带0
15、s
16、ss
17、Z UTC时区偏移
三、显示格式
1、displayFormat输入属性是用来指定dateTime值应该用什么方式来显示。
Date
2、pickerFormat输入属性
该属性决定了显示的界面应该有几列,并且每列是什么格式。如果没有提供该属性,那么会根据displayFormat来决定。
3、时间数据
以前处理时间数据可能需要js和HTML输入,并且js的Date对象是出了名的难以解析,更糟糕的是不同浏览器的和js版本解析各个字符串不同,,每个地区尤其如此。
ionic使用ISO 8601 时间格式: YYYY-MM-DDTHH:mm Z,这个值是一个简单的string,并且当使用ISO的时间格式时,这将更加容易序列化和传入JSON对象中,在当你传入数据库时也会更加容易解析。
格式
Year YYYY
Year and Month YYYY-MM
Complete Date YYYY-MM-DD
Date and Time YYYY-MM-DDTHH: mm
注意:年份总是4位数字、毫秒总是3位数字、并且其他都是2位数字,所以比如一月份就会被加上0,即01,另外,小时是24小时制的。
displayFormat和pickerFormat的输出值——ngModel是十分重要的,这些格式仅仅用于显示值在选择页面中,但是datetime总是使用ISO 8601时间字符串。
4、时间的最大值和最小值
日期在不同方向上是无限的,所以对用户的选择至少应该有某种限制,在默认情况下,最大年份是今年,最小年份是100年之前。
为了自定义最小和最大年份,min和max属性可以用来提供更加自定义的数值,而不是默认值,并且同意遵循ISO 8601标准。
Date
因为不存在所有情况都符合的时间名称,所以我们提供了一个数组,如果应用程序需要使用一个默认以外的时间名字,那么可以在app层面设置,也可以在ion-datetime层面设置。
app层面
import { ionicBootstrap } from 'ionic-angular';
ionicBootstrap(MyApp, customProviders, {
monthNames: ['janeiro', 'fevereiro', 'mar\u00e7o', ... ],
monthShortNames: ['jan', 'fev', 'mar', ... ],
dayNames: ['domingo', 'segunda-feira', 'ter\u00e7a-feira', ... ],
dayShortNames: ['dom', 'seg', 'ter', ... ],
});
组件层面
Período
1、min 最小
2、max 最大
3、dispayFormat
4、pickerFormat
5、cancelText 默认值为Cancel
6、doneText 默认值为Done
7、yearValues/monthValues/dayValues/hourValues/minutesValues/monthNames/monthShortNames/dayNames/dayShortNames:数组,更改默认值
8、pickerOptions
9、mode
10、disabled
五、输出属性
1、ionChange
当选中的时间被改变时
2、ionCancel
当选中的时间被取消时