Calendar 日历

按照日历形式展示数据的容器。

何时使用 #

当数据是日期或按照日期划分时,例如日程、课表、价格日历等,农历等。目前支持年/月切换。

代码演示

一个通用的日历面板,支持年/月切换。

通过 nzLocale 配置时区、语言等, 默认支持 en, zh-cn

用于嵌套在空间有限的容器中。

一个复杂的应用示例,用 dateCell 和 monthCell 模板来自定义需要渲染的数据。

API

参数 说明 类型 默认值
nzValue 展示日期 Date 当前日期
nzMode 初始模式,month/year String month
nzFullscreen 是否全屏显示 Boolean true
nzLocale 国际化配置 String zh-cn
dateCell 天模板 ng-template 说明:通过let-day获取day对象
{{'{'}}
  number: number;
  isLastMonth: boolean;
  isNextMonth: boolean;
  isCurrentDay: boolean;
  isSelectedDay: boolean;
  title: string;
  date: Moment;
  disabled: boolean;
  firstDisabled: boolean;
  lastDisabled: boolean;
{{'}'}}
monthCell 月模板 ng-template 说明:通过let-month获取month对象
{{'{'}}
  index: number;
  name: string;
  year: number;
  isCurrentMonth: boolean;
  isSelectedMonth: boolean;
{{'}'}}