ng-zorro-antd0.5x升级到1.8.1或者更高（当前最新9.3.0）

最新推荐文章于 2022-09-23 11:26:52 发布

酷恩Queen

最新推荐文章于 2022-09-23 11:26:52 发布

阅读量573

点赞数

分类专栏： angular 文章标签： angularjs ui

本文链接：https://blog.csdn.net/QueenKunkun/article/details/108997383

版权

这篇博客介绍了如何将ng-zorro-antd从0.5x版本升级到1.8.1或更高版本，如9.3.0。升级过程中涉及修改`package.json`的版本号，然后解决因API变化产生的代码报错，包括nz-input、nz-table、nzCheckbox、nz-datepicker、nz-pagination、nz-table-divider、nz-icon和nz-Modal等组件的更新细节。

摘要由CSDN通过智能技术生成

ng-zorro-antd0.5x升级到1.8.1或者更高（当前最新9.3.0）

package.json文件直接更改版本号

 - "ng-zorro-antd": "^0.6.15",
 +"ng-zorro-antd": "^1.8.1",

安装

npm install

成功升级之后需要按报错依次更改代码，大概有以下几种（不全，仅供参考）：

所有常量属性不用变量表示方法

 - [nzSize]="'large'" [nzType]="'default'"
 + nzSize="large" nzType="default"

nz-input 输入框组件

nz-input标签更换为input标签，并增加nz-input属性
nzDisabled属性更换为disabled
nzPlaceHolder属性更换为placeholder
nzBlur事件更换为blur

 - <nz-input [(ngModel)]="searchName" [nzPlaceHolder]="'请输入企业名称'" [nzDisabled]="operationType=='detail'" (nzBlur)="companyNameChecker()"></nz-input>
 + <input nz-input [(ngModel)]=