Timeline时间轴

垂直展示的时间流信息。

何时使用

  • 当有一系列信息需要从上至下按时间排列时;
  • 需要有一条时间轴进行视觉上的串联时;

代码演示

Timeline基础用法。

圆圈颜色,绿色用于已完成、成功状态,红色表示告警或错误状态,蓝色可表示正在进行或其他默认状态。

在最后位置添加一个幽灵节点,表示时间轴未完成,还在记录过程中。可以指定ng-template#pending

可以通过 ng-template #custom 设置自定义元素。

API

nz-timeline-item

参数 说明 类型 默认值
nzColor 圈的颜色,固定为"green","red","blue" 'green'|'red'|'blue' 'blue'
pending 幽灵节点元素 ng-template
custom 自定义元素 ng-template