Skip to content

8.0.0

Compare
Choose a tag to compare
@vthinkxie vthinkxie released this 29 Jun 09:09
· 1756 commits to master since this release
3ed3fc9

Intro

Welcome to ng-zorro-antd 8.0.0. After upgrading to the latest version, developers can not only enjoy the latest version of Angular, but also get the latest features and better performance.

You need to update your Angular to ^8.0.0 before update. Some ng-zorro-antd APIs are deprecated in version 8.0.0, and all deprecated APIs will still be supported until 9.0.0, which means that version 8.0.0 is fully compatible with version 7.0.0. Developers can get detailed tips on deprecated APIs in the development environment (prompts will not appear in production environments) and have plenty of time to fix these usages before 9.0.0 is released.

  • New Typography Component, which provides basic formatting and common operations for text.

  • Support admin template when run ng add ng-zorro-antd, more info can be found in Schematics part.

  • The Form Component has been fully enhanced, developers only needs to pass in the error tips.

<nz-form-control nzErrorTip="Please input your username!">
  <nz-input-group [nzPrefix]="prefixUser">
    <input formControlName="userName" nz-input placeholder="Username" />
  </nz-input-group>
</nz-form-control>
  • There is no need to wrap the dropdown directive with nz-dropdown now.
<a nz-dropdown [nzDropdownMenu]="menu">Hover me</a>
<nz-dropdown-menu #menu="nzDropdownMenu">
  <ul nz-menu>
    <li nz-menu-item>1st menu item</li>
    <li nz-menu-item>2nd menu item</li>
    <li nz-menu-item>3rd menu item</li>
  </ul>
</nz-dropdown-menu>
  • Menu support automatic highlighting based on routing.
<ul nz-menu nzMode="horizontal">
  <li nz-menu-item nzMatchRouter>
    <a [routerLink]="['/', 'welcome']">Welcome</a>
  </li>
</ul>

Angular Update Guide

It is recommended to upgrade according to the Angular Update Guide prompt. The following questions may require additional attention:

Features

  • avatar: add nzSrcSet & nzAlt properites (#3583) (d0ad5e8), closes #3543
  • breadcrumb: support dropdown (#3636) (9dfab45)
  • carousel: support dot position (#3575) (0566331)
  • core: add universal logger funcs and deprecation warnings (#3538) (b893520)
  • form: refactor form to support better template driven (10d0e28)
  • input-number: support nzId (a6500c8)
  • menu: support auto active menu-item via routerLink (c9e84c7)
  • menu: support nzTitle & nzIcon in nz-submenu (0cde4d7)
  • pagination: support pagination nzDisabled (141bef8)
  • select: support custom template in select component (#3071) (aad02a5), closes #2946
  • table: support nzVirtualForTrackBy (cb14096)
  • transfer: add nzShowSelectAll & nzRenderList properties (#3588) (1619f30), closes #3567 #2870
  • typography: add typography component (#3119) (4d739ef)
  • schematics: add template option in ng-add (#3674) (69072de)

Bug Fixes

  • button: fix order of DOM nodes in button (#3578) (c3df8b5), closes #3079
  • card: fix card tab ng-template (#3654) (7585ba4)
  • descriptions: fix warning without logger (#3663) (5826fc1)
  • dropdown: dropdown should close when set disabled (0bd1ae3), closes #3420
  • dropdown: fix dropdown change after checked bug (16d5c2d)
  • dropdown: fix dropdown SSR bug (#3628) (ade1abd)
  • form: fix form control validate with formControl (bc54e90), closes #3551
  • form: fix form overlap (#3633) (0fc7d05), closes #3607
  • form: fix nzValidateStatus & nzHasFeedback overlap (fb4965b), closes #3607
  • grid: Make all properties in EmbeddedProperty optional (#3473) (107e731)
  • input: fix ng-content nzAddOnBeforeIcon transclusion (#3597) (a37ec0a), closes #3596
  • mention: fix cannot to switch trigger (#3632) (c8b5b09), closes #3629
  • menu: fix menu title ExpressionChangedAfterItHasBeenCheckedError (52975ff), closes #3023
  • menu: fix submenu not active when collapsed (67f6fa2), closes #3345
  • pagination: fix pagination nzTotal 0 bug (#3651) (d28fc49), closes #3648
  • select: fix nzOpen state when nzOnSearch trigger (3ca816d), closes #3626
  • select: fix select enter open when disabled (36db36c), closes #3408
  • select: fix the bug of duplication when keyboard input chinese char (#3440) (3c82f26), closes #3439
  • table: compatible with @angular/material/table (79b02ca)
  • table: fix sortChange with dynamic columns (#3603) (#3605) (c85743d)
  • typography: fix the actions button order (#3677) (c2c28a4)
  • typography: not render when the edit text has no changes (51b9ce0)

版本介绍

欢迎来到 ng-zorro-antd 的 8.0.0 版本,升级到最新版本之后,开发者不仅可以享受到最新版本 Angular 的支持,还可以获得最新特性和更好的性能。

在升级之前请首先升级 Angular 至 8.0.0 以上版本,ng-zorro-antd 的部分 API 在 8.0.0 版本进入弃用状态,所有弃用 API 在 9.0.0 之前仍然会的得到支持,这意味着 8.0.0 版本 与 7.0.0 版本是 完全兼容 的。开发者可以在开发环境下获得弃用 API 的详细提示(生产环境下提示不会出现),并在 9.0.0 发布之前有充足的时间修正这些用法。

  • 新增 Typography 组件,该组件提供了文本的基本格式及常见操作。

  • ng add ng-zorro-antd 时新增模板选项,可以更方便的初始化项目,更多信息可以在脚手架部分查看。

  • 对 Form 表单进行了全面增强,新版本只需要直接传入错误提示内容即可工作。

<nz-form-control nzErrorTip="Please input your username!">
  <nz-input-group [nzPrefix]="prefixUser">
    <input formControlName="userName" nz-input placeholder="Username" />
  </nz-input-group>
</nz-form-control>
  • Dropdown 不再需要 Component 包裹 Directive 的写法,避免 Component 的 selector 对于 样式的影响。
<a nz-dropdown [nzDropdownMenu]="menu">Hover me</a>
<nz-dropdown-menu #menu="nzDropdownMenu">
  <ul nz-menu>
    <li nz-menu-item>1st menu item</li>
    <li nz-menu-item>2nd menu item</li>
    <li nz-menu-item>3rd menu item</li>
  </ul>
</nz-dropdown-menu>
  • Menu 增加自动根据路由高亮的功能。
<ul nz-menu nzMode="horizontal">
  <li nz-menu-item nzMatchRouter>
    <a [routerLink]="['/', 'welcome']">Welcome</a>
  </li>
</ul>

升级 Angular 版本

推荐根据 Angular Update Guide 提示进行升级,以下几个问题可能需要额外注意:

Features

  • avatar: 增加 nzSrcSet nzAlt 属性 (#3583) (d0ad5e8), closes #3543
  • breadcrumb: 支持在 breadcrumb 中加入 dropdown (#3636) (9dfab45)
  • carousel: 支持修改 dot 位置 (#3575) (0566331)
  • form: 支持直接传入错误信息 (10d0e28)
  • input-number: 支持 nzId 属性 (a6500c8)
  • menu: 支持按照 routerLink 自动激活状态 (c9e84c7)
  • menu: 支持直接传入 nzTitle & nzIcon (0cde4d7)
  • pagination: 支持 nzDisabled 状态 (141bef8)
  • select: 支持自定义展示 template (#3071) (aad02a5), closes #2946
  • table: 支持 nzVirtualForTrackBy 属性 (cb14096)
  • transfer: 增加 nzShowSelectAll & nzRenderList 属性 (#3588) (1619f30), closes #3567 #2870
  • typography: 增加 typography 组件 (#3119) (4d739ef)
  • schematics:ng-add 支持新建模板 (#3674) (69072de)

Bug Fixes

  • button: 修复 button 初始化 icon 顺序问题 (#3578) (c3df8b5), closes #3079
  • descriptions: 修复 warning 问题 (#3663) (5826fc1)
  • dropdown: 当 disabled 时关闭 dropdown (0bd1ae3), closes #3420
  • form: 修复 formControl 下的校验问题 (bc54e90), closes #3551
  • form: 修复 form 中 nz-input-group 图标重叠问题 (#3633) (0fc7d05), closes #3607
  • grid: 修复 typescript 定义 (#3473) (107e731)
  • input: 修复 nzAddOnBeforeIcon 动态切换时的问题 (#3597) (a37ec0a), closes #3596
  • mention: 修复 trigger 切换时的问题 (#3632) (c8b5b09), closes #3629
  • menu: 修复 title 改变导致的 ExpressionChangedAfterItHasBeenCheckedError (52975ff), closes #3023
  • menu: 修复 submenu 在 collapsed 时激活状态的问题 (67f6fa2), closes #3345
  • pagination: 修复 pagination 在 nzTotal 为 0 下的显示问题 (#3651) (d28fc49), closes #3648
  • select: 修复在 nzOnSearch 触发时 nzOpen 状态问题 (3ca816d), closes #3626
  • select: 修复在 disabled 状态下回车可以打开 select 的问题 (36db36c), closes #3408
  • select: 修复在 chrome 49 下中文输入法引发的问题 (#3440) (3c82f26), closes #3439
  • table: 修复与 @angular/material/table 的兼容问题 (79b02ca)
  • table: 修复与 table 边框状态下固定列样式问题 (31e674d)
  • table: 修复在列数动态调整下 sortChange 触发逻辑问题 (#3603) (#3605) (c85743d)