Skip to content

10.0.0

Compare
Choose a tag to compare
@hsuanxyz hsuanxyz released this 28 Sep 13:36
· 1265 commits to master since this release
6bf1984

NG-ZORRO 10.0.0

Welcome to the 10.0.0 release of ng-zorro-antd, the latest version is built with Angular 10 and TypeScript 4, synchronized to Ant Design 4.6 style, which includes Bug Fixes(30+) Features(10+) and removes deprecated codes.

Highlights

Add Pipes experimental module

import { NzPipesModule } from 'ng-zorro-antd/pipes';

Including Aggregate, Ellipsis, SafeNull (null conversion) and more.

New Tabs component interaction

Synchronize Ant Design's interaction design, and deprecate the nzShowPagination, nzOnNextClick, and nzOnPrevClick APIs.

tabs

Add week, month, year range pickers

Remove previously deprecated APIs

Remove primary entry and NgZorroAntdModule.

Removal of most of the compatible code reduces both bundle size and execution efficiency and introduces more structural names for the Interfaces.

Migration Guide

1.Migration to secondary entry(if needed)

// Before
import {  NzButtonModule, NzNoAnimationModule } from 'ng-zorro-antd';

// After
import { NzButtonModule } from 'ng-zorro-antd/button';
import { NzNoAnimationModule } from 'ng-zorro-antd/core/no-animation';

We have already marked NgZorroAntdModule and the primary entry as deprecated in v8. In this release, both of formers are removed completely. You are recommended to use NG-ZORRO TSLint to check/fix the import entry in your project.

(1) Install NG-ZORRO TSLint

$ npm i nz-tslint-rules -D

(2) Configuration tslint.json

{
  "rulesDirectory": [
    "node_modules/nz-tslint-rules"
  ],
  "rules": {
    "nz-secondary-entry-imports": true
  }
}

(3) Run TSLint to check/fix your project

$ tslint --project <tsconfig> --fix

2.Upgrade dependencies

3.Upgrade NG-ZORRO

  • Run ng update ng-zorro-antd.
  • If any warning messages appear in the console, follow the prompts to modify the corresponding code.

CHANGELOG

Bug Fixes

Code Refactoring

  • anchor: remove deprecated APIs for v10 (#5776) (e50d530)
  • cascader: remove deprecated APIs for v10 (#5778) (7e64e4c)
  • code-editor: remove deprecated APIs for v10 (#5798) (353e657)
  • date-picker: remove deprecated APIs for v10 (#5793) (5159900)
  • form,grid: remove deprecated APIs for v10 (#5788) (b215efa)
  • notification: remove deprecated APIs for v10 (#5779) (e5ed4d2)
  • table: remove deprecated APIs for v10 (#5792) (132e425)
  • tooltip, popover, popconfirm: change deprecated APIs for v10 (#5817) (dc3088c)
  • tree: remove deprecated APIs for v10 (#5789) (b378cb7)
  • upload: remove deprecated APIs for v10 (#5774) (9f5baae)

Features

BREAKING CHANGES

tooltip, popover, popconfirm:

  • nz-tooltip
    • [nzOverlayStyle] has been removed, use [nzTooltipOverlayStyle] instead.
    • [nzOverlayClassName] has been removed, use [nzTooltipOverlayClassName] instead.
    • [nzMouseLeaveDelay] has been removed, use [nzTooltipMouseLeaveDelay] instead.
    • [nzMouseEnterDelay] has been removed, use [nzTooltipMouseEnterDelay] instead.
    • (nzVisibleChange) has been removed, use (nzTooltipVisibleChange) instead.
  • nz-popover
    • [nzOverlayStyle] has been removed, use [nzPopoverOverlayStyle] instead.
    • [nzOverlayClassName] has been removed, use [nzPopoverOverlayClassName] instead.
    • [nzMouseLeaveDelay] has been removed, use [nzPopoverMouseLeaveDelay] instead.
    • [nzMouseEnterDelay] has been removed, use [nzPopoverMouseEnterDelay] instead.
    • (nzVisibleChange) has been removed, use (nzPopoverVisibleChange) instead.
  • nz-popconfirm
    • [nzOverlayStyle] has been removed, use [nzPopconfirmOverlayStyle] instead.
    • [nzOverlayClassName] has been removed, use [nzPopconfirmOverlayClassName] instead.
    • [nzMouseLeaveDelay] has been removed, use [nzPopconfirmMouseLeaveDelay] instead.
    • [nzMouseEnterDelay] has been removed, use [nzPopconfirmMouseEnterDelay] instead.
    • (nzVisibleChange) has been removed, use (nzPopconfirmVisibleChange) instead.

code-editor:

  • NzCodeEditorService.updateDefaultOption has been removed, use NzConfigService.set instead.
  • Inject token NZ_CODE_EDITOR_CONFIG has been removed, use NZ_CONFIG instead.

date-picker:

  • NZ_DATE_FNS_COMPATIBLE has been removed. Please migrate to date-fns v2 manually.
  • nz-date-picker,nz-week-picker,nz-month-picker,nz-year-picker,nz-range-picker
    • [nzClassName] has been removed, use ngClass instead.
    • [nzStyle] has been removed, use ngStyle instead.

table:

  • th[nzSort] has been removed, use th[nzSortOrder] instead.
  • th(nzSortChange) has been removed, use th(nzSortOrderChange)` instead.
  • th(nzSortChangeWithKey) has been removed. Please manually remove it.
  • thead(nzSortChange) has been removed, use thead(nzSortOrderChange) instead.
  • thead[nzSingleSort] and th[nzSortKey] has been removed. Please manually change to th[nzSortFn].

form,grid:

  • nz-form-item[nzFlex] has been removed. Please manually remove this input.
  • nz-form-item[nzType] has been removed. Please manually remove this input.
  • nz-row[nzType] has been removed. Please manually remove this input.

tree:

  • NzTreeNode.isAllChecked has been removed, use NzTreeNode.isChecked instead.
  • NzTreeNode.setSelected(boolean) has been removed, use NzTreeNode.isSelected = boolean instead.

notification:

  • NzNotificationDataFilled has been removed, use NzNotificationRef instead.
  • NzNotificationDataOptions.nzPosition has been removed, use NzNotificationDataOptions.nzPlacement instead.

anchor:

  • nzTarget has been removed, use nzContainer instead.

cascader:

  • CascaderOption has been removed, use NzCascaderOption instead.
  • CascaderSearchOption has been removed, use NzCascaderSearchOption instead.

upload:

  • UploadType has been removed, use NzUploadType instead.
  • UploadListType has been removed, use NzUploadListType instead.
  • UploadFile has been removed, use NzUploadFile instead.
  • UploadChangeParam has been removed, use NzUploadChangeParam instead.
  • ShowUploadListInterface has been removed, use NzShowUploadList instead.
  • UploadTransformFileType has been removed, use NzUploadTransformFileType instead.
  • UploadXHRArgs has been removed, use NzUploadXHRArgs instead.

版本介绍

欢迎来到 ng-zorro-antd 的 10.0.0 版本,最新版本使用 Angular 10 和 TypeScript 4 构建,同步到了 Ant Design 4.6 样式。包含 Bug Fixes(30+) Features(10+) 并移除了之前版本的弃用代码,更多 Features 将会在 10.x 后续版本释出。

添加了 Pipes 试验性模块

import { NzPipesModule } from 'ng-zorro-antd/pipes';

包含 Aggregate(聚合)、Ellipsis(字符省略)、SafeNull(null 转换) 等常用 Pipe。

新的 Tabs 组件交互

同步了 Ant Design 的交互设计,弃用了 nzShowPagination 、 nzOnNextClick 、nzOnPrevClick API。

tabs

新增 Week, Month, Year 范围选择器

移除了之前弃用的 API

移除了一级入口及 NgZorroAntdModule,提高编译速度;移除了许多兼容代码减少了包体积和执行效率以及更好的 Interface 命名。

升级指南

1.迁移到二级入口(如果需要)

// 之前
import {  NzButtonModule, NzNoAnimationModule } from 'ng-zorro-antd';

// 之后
import { NzButtonModule } from 'ng-zorro-antd/button';
import { NzNoAnimationModule } from 'ng-zorro-antd/core/no-animation';

我们已经在 v8 中弃用了 NgZorroAntdModule 和一级入口,并保留了 2 个版本后在此版本中移除,你可以使用 NG-ZORRO TSLint 来检查/修复项目中的引入入口。

(1) 安装 NG-ZORRO TSLint

$ npm i nz-tslint-rules -D

(2) 配置 tslint.json

{
  "rulesDirectory": [
    "node_modules/nz-tslint-rules"
  ],
  "rules": {
    "nz-secondary-entry-imports": true
  }
}

(3) 运行 TSLint 检查项目中的一级入口并修复

$ tslint --project <tsconfig> --fix

2. 升级相关依赖

  • 前往 https://update.angular.io/ 将项目升级到 Angular10。
  • 如果你有单独使用 @angular/cdk 请执行 ng update @angular/cdk
  • 如果你有单独使用 date-fns@1.x 请先升级到 2.x

3.升级 NG-ZORRO

  • 运行 ng update ng-zorro-antd
  • 如果控制台出现警告消息请按提示修改对应代码

CHANGELOG

Bug Fixes

Code Refactoring

Features

BREAKING CHANGES

tooltip, popover, popconfirm:

  • nz-tooltip
    • [nzOverlayStyle] 已经移除, 请使用 [nzTooltipOverlayStyle] 代替。
    • [nzOverlayClassName] 已经移除, 请使用 [nzTooltipOverlayClassName] 代替。
    • [nzMouseLeaveDelay] 已经移除, 请使用 [nzTooltipMouseLeaveDelay] 代替。
    • [nzMouseEnterDelay] 已经移除, 请使用 [nzTooltipMouseEnterDelay] 代替。
    • (nzVisibleChange) 已经移除, 请使用 (nzTooltipVisibleChange) 代替。
  • nz-popover
    • [nzOverlayStyle] 已经移除, 请使用 [nzPopoverOverlayStyle] 代替。
    • [nzOverlayClassName] 已经移除, 请使用 [nzPopoverOverlayClassName] 代替。
    • [nzMouseLeaveDelay] 已经移除, 请使用 [nzPopoverMouseLeaveDelay] 代替。
    • [nzMouseEnterDelay] 已经移除, 请使用 [nzPopoverMouseEnterDelay] 代替。
    • (nzVisibleChange) 已经移除, 请使用 (nzPopoverVisibleChange) 代替。
  • nz-popconfirm
    • [nzOverlayStyle] 已经移除, 请使用 [nzPopconfirmOverlayStyle] 代替。
    • [nzOverlayClassName] 已经移除, 请使用 [nzPopconfirmOverlayClassName] 代替。
    • [nzMouseLeaveDelay] 已经移除, 请使用 [nzPopconfirmMouseLeaveDelay] 代替。
    • [nzMouseEnterDelay] 已经移除, 请使用 [nzPopconfirmMouseEnterDelay] 代替。
    • (nzVisibleChange) 已经移除, 请使用 (nzPopconfirmVisibleChange) 代替。

code-editor:

  • NzCodeEditorService.updateDefaultOption 已经移除, 请使用 NzConfigService.set 代替。
  • Inject token NZ_CODE_EDITOR_CONFIG 已经移除, 请使用 NZ_CONFIG 代替。

date-picker:

  • NZ_DATE_FNS_COMPATIBLE 已经移除. 请手动迁移到 date-fns v2。
  • nz-date-picker,nz-week-picker,nz-month-picker,nz-year-picker,nz-range-picker
    • [nzClassName] 已经移除, 请使用 ngClass 代替。
    • [nzStyle] 已经移除, 请使用 ngStyle 代替。

table:

  • th[nzSort] 已经移除, 请使用 th[nzSortOrder] 代替。
  • th(nzSortChange) 已经移除, 请使用 th(nzSortOrderChange)` 代替。
  • th(nzSortChangeWithKey) 已经移除, 请手动移除。
  • thead(nzSortChange) 已经移除, 请使用 thead(nzSortOrderChange) 代替。
  • thead[nzSingleSort]th[nzSortKey] 已经移除, 请手动修改为 th[nzSortFn]

form,grid:

  • nz-form-item[nzFlex] 已经移除, 请手动移除。
  • nz-form-item[nzType] 已经移除, 请手动移除。
  • nz-row[nzType] 已经移除, 请手动移除。

tree:

  • NzTreeNode.isAllChecked 已经移除, 请使用 NzTreeNode.isChecked 代替。
  • NzTreeNode.setSelected(boolean) 已经移除, 请使用 NzTreeNode.isSelected = boolean 代替。

notification:

  • NzNotificationDataFilled 已经移除, 请使用 NzNotificationRef 代替。
  • NzNotificationDataOptions.nzPosition 已经移除, 请使用 NzNotificationDataOptions.nzPlacement 代替。

anchor:

  • nzTarget 已经移除, 请使用 nzContainer 代替。

cascader:

  • CascaderOption 已经移除, 请使用 NzCascaderOption 代替。
  • CascaderSearchOption 已经移除, 请使用 NzCascaderSearchOption 代替。

upload:

  • UploadType 已经移除, 请使用 NzUploadType 代替。
  • UploadListType 已经移除, 请使用 NzUploadListType 代替。
  • UploadFile 已经移除, 请使用 NzUploadFile 代替。
  • UploadChangeParam 已经移除, 请使用 NzUploadChangeParam 代替。
  • ShowUploadListInterface 已经移除, 请使用 NzShowUploadList 代替。
  • UploadTransformFileType 已经移除, 请使用 NzUploadTransformFileType 代替。
  • UploadXHRArgs 已经移除, 请使用 NzUploadXHRArgs 代替。