npm ng-zorro-antd 7.0.0
on Node.js NPM

latest releases: 20.2.1, 20.2.0, 20.1.3...
6 years ago

It has been three months since we released the last stable version 1.8.1, and now here comes ng-zorro-antd 7.0.0! (From 7.0.0, the package’s major version number would be aligned to Angular’s)
According to the road map we published last year, we add 105 commits on the top of the last three release candidate versions. Now we have reached Milestone I.

  • All components now work with OnPush change detection strategy. You can anticipate a tremendous improvement of performance.
  • Animations are updated to meet Ant Design’s specifications. And you can configure animation globally or specifically to each component.
  • New components: Empty, Statistic, Countdown and Comment.
  • New features of Angular CDK is introduced to some components. For example, Table component now supports virtual scrolling.
  • Lots of new features. Lots of bug fixes.
  • You can use ISO date format in components like Calendar & Date Picker.
  • Global scrolling strategy is changed. Modal and Drawer components will no longer shake under some circumstances.
  • More strict TypeScript compiler options.
  • Brand new logo and documentation site.

We will move on to Milestone II right after this release. Server side rendering (SSR), secondary entries, global configurations and dynamic validation would be supported in future versions to come.

Update Guidance

  1. Update Angular and other packages to newest versions.

  2. Update ng-zorro-antd to 7.0.

Notice

Pay attention to these changes to ensure that your code works as expected:

  1. All components now work with OnPush strategy. Components with this strategy would not respond to mutations on object properties or array child items, even decorated with @input(). So you should make all your @input properties immutable objects. Not only this would ensure your code works correctly but also improve performance if you use immutable objects right. Please checkout our example below.
  2. We correct the meaning of nzDropdownMatchSelectWidth of Select component. Now it means exactly opposite of the old one.
  3. If you want to add a button to an input-group in search mode, you should use nzAddOnAfter instead of nzSuffix.

Changelog

Bug Fixes

Features

距离上一个稳定版本的发布已经有 3 个月的时间，从 7.0 版本开始，ng-zorro-antd 将和其他 Angular 第三方库一样，保持与 Angular 的主版本号一致。按照路线图的规划，我们在 7.0 前三个 rc 版本的基础上增加了 105 个 commits，目前我们已经按计划完成了第一阶段的 Milestone，包含但不限于以下内容

  • 全部组件默认工作在 OnPush 模式下，大幅度提升了组件性能
  • 完成 web animation 与 antd 动画的对应，并支持对每个组件的动画进行全局和单独配置
  • 增加了 Empty、Statistic、CountDown、Comment 等实用组件
  • 支持了最新的 CDK 特性，Table 等组件支持虚拟滚动
  • 增加了大量新的功能，并修复了大部分之前组件存在的问题
  • 日期相关组件支持可选的 ISO 标准日期格式化（依赖Date-fns库），解决周数算法不一致等问题
  • 更换了新的全局滚动策略，Modal Drawer 在特殊情况下弹出时页面不再抖动
  • 更加严格的 TSLint 校验
  • 全新的 LOGO 和 文档系统

我们会在 7.0 正式版本发布后立刻进行第二阶段的 Milestone 工作，该部分规划包含完整的服务端渲染支持，a11y，独立的包引入机制，全局的组件配置方式，输入数据的动态校验等等，这些功能会在随后的版本中逐步发布。

升级指南

第一步：升级 Angular 及配套环境至最新版本

第二步：升级 ng-zorro-antd 至 7.0 正式版

注意：

7.0 正式版有三处更新可能需要修改少量业务代码后才能使用：

  1. 7.0 正式版绝大部分组件都默认工作在 OnPush 模式下，OnPush 模式下的组件不会对 Input() 的可变对象 (mutate) 情况进行响应，所有组件 @Input 内容应修改为不可变对象 (immutable)，具体情况见最后示例代码，正确使用不可变对象可以大幅度优化应用性能。
  2. 我们修正了 Select 组件中  [nzDropdownMatchSelectWidth] 的实际含义，与之前版本相反。
  3. Input Group Search 模式下 button 传入由 nzSuffix 换为 nzAddOnAfter。

更新日志

Bug Fixes

  • affix: trigger 元素 resize 时应该重置 placeholder 大小 (#2835) (7068a5e), closes #2818
  • anchor: 修复组件销毁后调用 detectChanges 的问题 (#2864) (0e5c937), closes #2860
  • animation: 修复 路由变化时动画触发的问题 (#2895) (e39f6bf)
  • build: 修复 build target 为 ES6 时的问题 (#2921) (ab62b40), closes #2893
  • carousel: 修复在 modal 或 card 中不渲染的问题 (#2699) (e092bf0), closes #2387 ,#2226
  • carousel: 修复轮播图不能点击的问题 (#2699) (e092bf0), closes #2631
  • carousel: 修复轮播图在窗口 resize 时内容错位的问题 (#2699) (e092bf0), closes #2158
  • cascader: 修复当 nzOptions 为空时搜索错误的问题 (#2846) (e33cc50), closes #2784
  • cascader: 修复子节点 loading 状态未变化的问题 (#2986) (b87e8bb)
  • core: 修复 CDK 样式冲突 (#2917) (37cf6f3), closes #2874
  • date-picker & calendar & time-picker: 提供新的可选方式来解决不符合ISO标准算法的周数 (#2819) (e1bce41), closes #2819 ,#2406
  • drawer: 修复 body overflow 的问题 (#2867) (1e081f0), closes #2227 #2615
  • grid: 修复 Grid 响应式问题 (#2915) (ab05619), closes #2908
  • i18n: 修复法语文件中的字段丢失 (#2586) (#2737) (c821d56)
  • i18n: 导出 da_DK 以及更新对于文档 (#2599) (6554cf5)
  • icon: 修复错误重新的渲染 (#2912) (6dd3cbf), closes #2911
  • input: 修复对新 icon API 兼容性的问题 (#2841) (3c954cb)
  • menu & dropdown: 修复Firefox下定位问题 (#2816) (09f21d0), closes #2834
  • modal, drawer: 修复 IE/Edge 下 SVG blur/focus 方法找不到的问题 (#2869) (7487a7e), closes #2388
  • modal: 修复 body overflow 的问题 (#2869) (7487a7e), closes #2612
  • modal: 修复 OnPush 容器下无法关闭蒙层 (#2869) (7487a7e), closes #2643
  • radio: 在 label 中子元素无法聚焦 (#2850) (58743b8), closes #2774
  • select: 修复 nzScrollToBottom 在浏览器缩放下的问题 (#2741)
  • select: 修复 多选情况下 Input 框大小变化问题 (#2741)
  • select: 修复 定位到多个 Option 的问题 (#2741)
  • switch: 修复当 loading or disabled 时切换的问题 (#2896) (a67984c), closes #2787
  • table: 修复 Firefox 浏览器下边框样式问题 (#2862) (074083e)
  • table: 修复 ngIf 情况下 th 排序事件不触发的问题 (#2862) (074083e)
  • table: 修复 靠右对齐的固定多列的问题 (#2862) (074083e)
  • time-picker: 将清除按钮调整放置到外层输入框处 (#2948) (ffb6665)
  • tooltip: 修复 nzTitle 没有更新的问题 (#2698) (f6dfbd9), closes #2695
  • tree-select: 修复 overlay 层级覆盖问题 (#2764) (599ae1a), closes #2730
  • tree: 修复 loading 图标位置偏移问题 (#1998) (36c91ac), closes #1998
  • tree: 修复 nzCheckStrictly 状态下父子节点关联问题 (#2655 #2370) (36c91ac), closes #2655 ,#2370
  • tree: 修复 nzShowIcon 为 false icon 仍然有效问题 (#2724) (36c91ac), closes #2724
  • tree: 修复 setChecked 方法状态同步问题 (#2273) (36c91ac), closes #2273
  • tree: 修复展开动画 (#2989) (5142d18)

Features

Check out latest releases or
releases around ng-zorro-antd 7.0.0

Don't miss a new ng-zorro-antd release

NewReleases is sending notifications on new releases.

Get notifications