| 组件 | 文档 | 测试 | 功能 | 负责 | 重写 |
|---|---|---|---|---|---|
| button | √ | 100% | 100% | vthinkxie | - |
| icon | √ | - | 100% | vthinkxie | - |
| grid | √ | 100% | 100% | vthinkxie | - |
| layout | √ | 100% | 100% | vthinkxie | - |
| breadcrumb | √ | 100% | 100% | vthinkxie | - |
| dropdown | √ | 100% | 100% | vthinkxie | - |
| menu | √ | 100% | 100% | vthinkxie | √ |
| pagination | √ | 100% | 100% | vthinkxie | - |
| steps | √ | 100% | 100% | vthinkxie | - |
| checkbox | √ | 100% | 100% | vthinkxie | - |
| form | √ | 100% | 100% | vthinkxie | √ |
| input | √ | 100% | 100% | vthinkxie | √ |
| inputnumber | √ | 100% | 100% | vthinkxie | √ |
| radio | √ | 100% | 100% | vthinkxie | - |
| rate | √ | 100% | 100% | vthinkxie | - |
| select | √ | 100% | 100% | vthinkxie | √ |
| switch | √ | 100% | 100% | vthinkxie | - |
| badge | √ | 100% | 100% | vthinkxie | - |
| card | √ | 100% | 100% | vthinkxie | - |
| carousel | √ | 100% | 100% | vthinkxie | - |
| collapse | √ | 100% | 100% | vthinkxie | - |
| table | √ | 100% | 100% | vthinkxie | √ |
| tabs | √ | 100% | 100% | vthinkxie | - |
| timeline | √ | 100% | 100% | vthinkxie | - |
| alert | √ | 100% | 100% | vthinkxie | - |
| progress | √ | 100% | 100% | vthinkxie | √ |
| spin | √ | 100% | 100% | vthinkxie | - |
| tags | √ | 100% | 100% | vthinkxie | √ |
| popover | x | x | x | wilsoncook | - |
| tooltip | x | x | x | wilsoncook | - |
| popconfirm | x | x | x | wilsoncook | - |
| slider | x | x | x | wilsoncook | - |
| modal | 90% | 100% | 100% | wilsoncook | √ |
| message | x | x | x | wilsoncook | - |
| notification | x | x | x | wilsoncook | - |
| datepicker | x | x | x | trotyl | - |
| time-picker | x | x | x | trotyl | - |
| calendar | √ | 100% | 100% | trotyl | √ |
| affix | √ | 100% | 100% | cipchk | √ |
| transfer | √ | 100% | 100% | cipchk | x |
| avatar | √ | 100% | 100% | cipchk | x |
| list | √ | 100% | 100% | cipchk | x |
| upload | √ | 100% | 100% | cipchk | x |
| anchor | √ | 100% | 100% | cipchk | √ |
| backtop | √ | 100% | 100% | cipchk | x |
| divider | √ | 100% | 100% | cipchk | x |
| treeselect | x | x | x | simplejason | - |
| tree | x | x | x | simplejason | - |
| cascader | x | x | x | fbchen | - |
| autocomplete | √ | 100% | 100% | HsuanXyz | - |
| mention | √ | 100% | 100% | HsuanXyz | - |
目前文档系统处于基本可用状态,依次执行
- git clone -b 0.7.0 https://github.com/NG-ZORRO/ng-zorro-antd.git ng-zorro-antd-0.7.0
- cd ng-zorro-antd-0.7.0
- npm i
- npm run site:init (初始化文档站点)
- ng serve 即可看到目前的doc及相关组件的开发进度
运行 ng serve 可以直接修改 ./components 会立即更新。
若修改DEMO代码,需要额外运行一次
node scripts/generate-site button表示重新生成 button 所有DEMO代码。
运行 ng test。
加速度
默认会执行 ./components 下所有 *.spec.ts,可手动调整 ./components/test.ts 文件的临时针对某个测试文件,提升测试体验。
进入 components 文件夹,每个组件会有一个单独的文件夹,其中包括
- demo 包括每个markdown说明文件.md和demo文件.ts
- doc 包括中英文的介绍markdown
- style 包括组件的样式文件 这三个文件夹,组件的原始代码在根文件夹中 demo、doc 和 style的初始内容可以直接从 antd react 项目中 https://github.com/ant-design/ant-design/tree/master/components/alert 获取,注意需要将index.zh-CN.md 和 index.en-US.md 手动移至 doc目录下 请注意,需要将antd react同步后的demo文件夹中的md文件中的jsx代码格式手动移除
demo文件夹中的ts文件名称与markdown的名称保持一致,具体可以参照已经完成的组件部分 其中demo的
- selector的命名: nz-demo-${组件名称}-${demo名称}
- component class的命名(驼峰):NzDemo${组件名称}${demo名称}Component
例如alert组件的banner demo的selector为
nz-demo-alert-banner,component class为NzDemoAlertBannerComponent
当按以上格式开发完成一个组件后,在ng serve的状态下
运行 npm run site 后,会快速同步src文件夹中的内容更新页面内容
测试代码与组件代码保持在同一目录,以spec.ts结尾 spec.ts测试文件从demo文件中引入ts文件作为测试的TestBed Component