通过Web API服务以AngualrJS HTML显示字节数组图像

Question

我正在为服务构建一个AngularJS应用程序，我正在使用.NET C＃进行编码。 现在，我遵循以下C＃字节数组后加载图像中提到的代码结构， 并使用AngularJS将图像放置在html标签中 -

但是在上述方法中，他们将图像作为Base64 Sting发送，这里我们将Angular HTML绑定到Base64。 它会降低加载性能。 在我的一篇帖子中，我得到了一个相关的答案： 使用.Net C＃压缩字节数组图像而不进行缩放 ，它指出“发送数据通常而不是使用Base64”字符串。

请帮助我如何在HTML <img />标签中显示字节数组图像。 目前，我正在使用以下

<img ng-src="data:image/jpeg;base64,{{ image.Content }}" />

Answer 1

通过这样的控制器函数调用二进制图像数据（作为可能的解决方案，请参阅Fiddle的链接）。

<img data-ng-src="{{getImage(image.Content)}}" />

$scope.getImage = function(data){
    return 'data:image/jpeg;base64,' + data;
}

看一下显示两种可能方法的小提琴。 以JSFiddle为例