在AngularJS中使用包含base64数据的变量加载图像src

2024-04-17

使用包含变量加载图像base64AngularJS 中的数据

我正在尝试找到从包含的变量加载图像源的正确方法base64编码图像数据(例如使用从画布中提取toDataURL(); ).

起初我只是尝试这样:

<img src="{{image.dataURL}}" />

其中图像是带有变量的范围变量dataURL含有base64数据。这实际上工作得很好,唯一的问题是我得到了一个404我的控制台出现错误。像这样的事情:

GET http://www.example.com/%7B%7Bimage.dataURL%7D%7D http://www.example.com/%7B%7Bimage.dataURL%7D%7D404(未找到)

不太漂亮。当我尝试像这样更有棱角的风格解决方案时:

<img data-ng-src="image.dataURL" />

the images are not loading at all. I made a fiddle which you can find HERE http://jsfiddle.net/wilt/4LJDB/3/

有什么建议如何消除我的控制台中的此错误吗?


EDIT:

粗鲁的兔子是对的。这<img data-ng-src="{{image.dataURL}}" />工作中...

Working solution can be found HERE http://jsfiddle.net/wilt/4LJDB/5/


ng-src 的内容需要进行插值:试试这个:

<img data-ng-src="{{image.dataURL}}"/>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

在AngularJS中使用包含base64数据的变量加载图像src 的相关文章

随机推荐