angularjs – 如何通过指令更改图像源属性
发布时间:2020-12-17 17:31:36 所属栏目:安全 来源:网络整理
导读:我有以下图片标签: img src="default.png" data-new-image/ newImage是我定义的一个指令,它将从服务器获取图像(基于某些条件),在计算和获取图像时,我显示了default.png图像文件. 在这个指令中,我将链接函数定义为: return { link: function (scope,element
我有以下图片标签:
<img src="default.png" data-new-image/> newImage是我定义的一个指令,它将从服务器获取图像(基于某些条件),在计算和获取图像时,我显示了default.png图像文件. 在这个指令中,我将链接函数定义为: return { link: function (scope,element,attrs) { //My custom logic here to determine which image to show //and then fetch from the server //After HTTP request,assigning image to image source attrs.src = "image_fetched_from_server.png"; } }; 但是这不会更新图像src属性.我可以看到清晰的图像和分配图像后的console.log(attrs)显示源属性已更新为新图像.但是浏览器中的DOM检查器显示没有对源的更改 – 它仍然显示default.png 我在这里使用指令而不是控制器 – 我知道我可以使用控制器并使用ng-src但我在多个控制器上有这个逻辑,指令是我的最佳选择.如何更改图像标记的来源?我想知道ng-src是怎么做到的? 解决方法
我找到了原因.
要在属性中设置值,我需要使用attrs.$set(attribute_name,value). 因此,我用attrs替换了attrs.src.$set(‘src’,’image_fetched_from_server.png’);它工作了! (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |