ng-zorro-antd版本升级0.5x升级到1.8.1或者更高(当前最新9.3.0)

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-table 表格组件

nzDataSource属性更换为nzData,
nzIsPagination属性更换为nzShowPagination
nzCustomNoResult属性更换为nzNoResult

 - 
 +  

nzCheckbox 选择框组件

nzCheckbox属性更换为nzShowCheckbox
ngModel属性更换为nzChecked
ngModelChange属性更换为nzCheckedChange

 -                 
 -     
 - 
 + 

nz-datepicker 日期选择器组件

nzCheckbox属性更换为nzShowCheckbox
nzDisabledDate属性更换为nzDisabledTime

 - 

nz-pagination 分页组件

nzShowTotal属性由布尔值变成TemplateRef


          
            共 {{total}} 条
          

nz-table-divider 分割线组件

nz-table-divider属性更换为nz-divider标签,并增加nzType属性

 - 
 + 

nz-icon 图标组件

class属性改为nzType,且去掉antion-,并增加nz-icon属性,增加nzTheme属性

 - 
 + 

nz-Modal 模态框组件

所有属性前增加nz且驼峰写法

nMods.confirm({
 -       title: '电价已保存成功!',
 +      nzTitle: '电价已保存成功!',
 -      content: '您是否要继续执行该范围内其他等级电压?',
 +      nzContent: '您是否要继续执行该范围内其他等级电压?',
 -       okText: '继续',
 +      nzOkText: '继续',
 -      onOk() {
 +     nzOnOk() {
    }
})

你可能感兴趣的:(ng-zorro-antd版本升级0.5x升级到1.8.1或者更高(当前最新9.3.0))