ng-zorro-antd中nz-table的问题

在使用ng-zorro-antd的nz-table时,遇到删除数据后'暂无数据'提示不消失的问题。文章指出,这是由于直接在原数组上操作导致的,Angular监听的是数组引用变化而不是内容变化。解决方法是通过赋值一个新的数组实例来改变引用,从而触发Angular的更新检测。加`nzData=[]`可以使nz-table正确显示'暂无数据'。
摘要由CSDN通过智能技术生成

前端项目中,我们经常会使用阿里开源的组件库:ant-design,其提供的组件已经足以满足多数的需求,拿来就能直接用,十分方便,当然了,有些公司会对组件库进行二次封装,改造成极具自家风格的产品。

在本系列的文章中,不谈高大上的东西,不深究底层源码,只分享一些项目中遇到的小问题。

表格(table)

——

以为是组件库的bug,没想到……

不知道正在阅读本文的读者有没有经历过:

  1. 在使用 <nz-table></nz-table>的时候,删除表格的最后一项时,展示“暂无数据”的图像,此后,再向表格中添加数据的时候,发现这个“暂无数据”的图像不消失了。
  2. 表格中展示了几条数据,但是批量删除了这些数据后(当然,也可以手动的一条一条删除),“暂无数据”的那张图并没有出现。

这个空状态怎么老和咱做对呢?就不能好好的满足我们的预期吗?别说,还真会,不过,偶然性极高。

  1. “暂无数据”图像在极少数的情况下会正常的显示(有多少呢?可能和再来一瓶的中奖率差不多吧)。 

发生这种问题的原因实际上非常简单,回忆一下我们在删除和添加的表项时,是不是像下面这样做的:

<nz
  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值