在加载我的HTML页面时,我有一个在AngularJS中编写的onload函数,它将从服务器获取图像文件的base64字符串,并将此base64字符串存储在$scope.product.image中。当我尝试显示这个base64字符串时,在控制台中会出现ERR_INVALID_URL错误。
错误消息如下:GET:data:image/jpg;base64,9j_4AAQSK.......... net: ERR_INVALID_URL
我的HTML代码如下:
<section ng-show="product.image">
{{product.image}} /* This actually displays the content of base64 string. This confirms that value is reaching properly*/
<img ng-src="{{'data:image/jpg;base64,'+product.image}}"/>
</section>
我的app.js看起来像这样
$scope.onload = function()
{
$http({method:'GET', url:'rest/product/onLoad'})
.success(function (response){
$scope.product.image = response.image;
});
};
我尝试使用 <img data-ng-src="data:image/jpg;base64,{{product.image}}">
,但没有成功。
如何将base64字符串加载为图像?
ng-src
的值并将其放入浏览器地址栏中,以检查数据 URL 是否有效吗? - MMhunter