首页 > 解决方案 > 如何将base64与src中的类型连接起来

问题描述

<div *ngFor="let el of list">
        <img [src]='el.photo'
</div>

Api retturn el.photo = '/9j/2wBDAAMCAgMCAgMDAw......'

我想与

data:image/jpeg;base64,

类似的东西

<img [src]='data:image/jpeg;base64, + 'el.photo''>

标签: javascriptangular

解决方案


首先是

<img [src]="'data:image/jpeg;base64,' + el.photo">

但我想这只是一个错误。但是,我建议您在控制器中而不是在视图中进行这样的连接(作为良好编码实践的一部分)。你可以例如。创建一个在控制器中返回连接字符串的函数:

function getBase64ImageSrc(photo) {
  return 'data:image/jpeg;base64,' + photo;
}

然后在视图中使用这个函数:

<img [src]="getBase64ImageSrc(el.photo)">

推荐阅读