基数 64 转换误差角 js

Question

我正在尝试从 JSON 数据解码 base64 图像并尝试将其绑定到 DOM，但图像未显示。

请检查以下代码：

.then(function mySuccess(response) {
$rootScope.vehiclenumber = response.data.vehicleNumber;
$rootScope.emailDriver = response.data.email;
imgUrl: "data:image/png;base64," + response.data.image;
$rootScope.userNamedriver = response.data.Name;
$rootScope.namedriver = response.data.userName;
console.log($rootScope.imgUrl);
$state.go('app.user');
}

<div>
<img data-ng-src="image/png;base64,{{imgURL}}" />
</div>

当我控制台 imgURL 时，它是未定义的。

Answer 1

试试这个：

我也把imgUrl放在rootScope上。 但未经测试，不确定使用 rootScope 是否是存储数据的最佳位置。

另请注意，您在模板中使用了 imgURL 而不是 imgUrl。

.then(function mySuccess(response) {
$rootScope.vehiclenumber = response.data.vehicleNumber;
$rootScope.emailDriver = response.data.email;
$rootScope.imgUrl = "data:image/png;base64," + response.data.image;
$rootScope.userNamedriver = response.data.Name;
$rootScope.namedriver = response.data.userName;
console.log($rootScope.imgUrl);
$state.go('app.user');
}

<div>
<img data-ng-src="{{imgUrl}}" />   
</div>

Answer 2

这是相同的工作代码。 我在 Angular 5 中完成了类似的任务，因此请按照以下步骤操作：-

1( 创建如下函数 getFileEncode(fileType： string( {

var encodevalue: string;
switch (fileType.toUpperCase()) {
case "PNG": encodevalue = 'data:image/jpeg;base64,'; break;
case "JPG": encodevalue = 'data:image/png;base64,'; break;
case "GIF": encodevalue = 'data:image/gif;base64,'; break;
}
return encodevalue;
}
2)  Var fileData = this.getFileEncode("PNG") + response.data.image;
//response.data.image should contain a byte array.
3)  Now bind to SRC of img tag as follows
$('#preview').attr('src', fileData).fadeIn('slow');

4(您正在从Web服务器接收json中的数据，因此您应该注意从json获取字节数组，可能需要进行一些转换。