加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 综合聚焦 > 服务器 > 安全 > 正文

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’);它工作了!

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读