angular ng-zorro 之upload图片上传,编辑时无法显示缩略图

最近在用ng-zorro中的图片上传时,发现已有的图片,无法在表单中的upload下显示,如下图可以看到我的数据是获取到的,然而在点击编辑按钮时,却无法显示图片缩略图。

无法正常显示缩略图
这是我在ts里定义的fileList变量:
在这里插入图片描述
这是点击编辑时对获取的当前数据的赋值处理,可以看到我相关的数据push到了fileList变量中。
在这里插入图片描述
这是我html中使用upload的相关代码,基本是抄的ng-zorro中的内容,照片墙
在这里插入图片描述
解决方式

在多方查询无法找到bug的情况下,自己一点点尝试,在我把相关的数据直接写死到fileList这个变量中进行测试时发现竟然成功了。这就说明我的这些数据是有效的,很有可能是我之前并没有把值传到这个变量中。
在这里插入图片描述
但是经过console.log打印发现,fileList是有值的。最后反复思考尝试,发现是push方法的问题。push可以把值正确的赋值到fileList这个变量中,但是通过push方法赋的值,在ng-zorro中的Upload中并不起效。然后我把刚才赋值方式改成如下方式。发现问题完美解决。
在这里插入图片描述
这是成功获取图片缩略图的内容。
在这里插入图片描述
注意:我之前只知道push方法对ng-zorro中的table数据渲染不起效,这是因为他们在table已经进行说明,但是在upload中并未说明。
在这里插入图片描述
所以特写下本次踩坑日记,希望能对同道中人有点帮助,为你们多节省点时间。

至于为什么push方法不起效,我也在研究中,暂时并没有答案,如果有哪位朋友知道答案,也欢迎你能够留言帮我解惑一下。谢谢!

  • 3
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值