阅读(4543) (0)

Angular EasyUI 日历

2020-06-24 16:19:21 更新

日历( Calendar )显示允许用户选择日期的一个月份日历,并允许移动到上一月和下一页。 日历( Calendar )在默认情况下,每星期的第一天设置为星期日。这可以通过设置 'firstDay' 属性的值来改变。

属性列表

名称 数据类型 作用描述 默认值
border boolean 是否显示边框。 true
firstDay number 定义每星期的第一天。星期日(Sunday)是 0,星期一(Monday)是 1,... 0
weeks string[ ] 显示星期的列表。 ['S','M','T','W','T','F','S']
months string[] 显示月份的列表。 ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
year number 日历的年。 当前年份(4 位)
month number 日历的月。 当前月份(从 1 开始)
showWeek boolean 是否显示周数。 false
selection Date 选择日期。 null
weekNumberHeader string 显示在周号标头上的标签。

  • 以指定的年和月创建日历的代码实例:

<div class="easyui-calendar" data-options="year:2012,month:6" />

事件列表

名称 参数 作用描述
selectionChange date 更改选择时触发。

方法列表

名称 参数 返回值 作用描述
selectDate date:Date void 选择一个日期。
highlightDate date:Date void 标出一个日期。
navDate step:number void 浏览日期。

注:
- 继承: None 。
- 选择器: eui-calendar 。

使用方法

<eui-calendar [(selection)]="value" style="width:250px;height:250px">
</eui-calendar>