Javascript AngularJS - 将字节数组内容显示为图像
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/14979791/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
AngularJS - Show byte array content as image
提问by Kiwanax
I'm searching into my database a image as a byte array. I want to show this content as file using the markup image, but it doesn't work here.
我正在我的数据库中搜索作为字节数组的图像。我想使用标记图像将此内容显示为文件，但在这里不起作用。
// Controller which get my image and put into $scope.
function MyController($scope, $http, $location) {
var url = '/json/FindImage?id=1';
$http.get(url).success(function(result) {
$scope.image = result.Image;
}
}
// HTML
<!-- It doesn't work -->
<img src="{{image}}" />
<!-- It doesn't work also -->
<img ng-src="{{image}}" />
Any idea? Thank you all!
任何的想法？谢谢你们！
回答by Assem-Hafez
Use ng-srcin the following format
使用ng-src下面的格式
<img ng-src="data:image/JPEG;base64,{{image}}">
Don't forget to add a sanitization filter for datato not be marked as unsafeby angular:
不要忘记添加一个消毒过滤器，data以免被unsafe角度标记：
$compileProvider.aHrefSanitizationWhitelist(/^\s*(https?|file|ftp|blob):|data:image\//);
回答by Anders Ekdahl
回答by Amir
Make sure The Data you are returning to show as a image is converted to ToBase64String
确保您返回显示为图像的数据转换为 ToBase64String
In your C# code, Use Convert.ToBase64String(imageBytes) and in the view use this
在您的 C# 代码中，使用 Convert.ToBase64String(imageBytes) 并在视图中使用此
回答by Xophmeister
The srcattribute of imgpoints to the source file of the image, it doesn't contain the actual source data. You can't do what you want this way; instead, you would have to write an image decoder in JavaScript (e.g., https://github.com/devongovett/png.js), which outputs into a canvaselement.
该src属性img指向图像的源文件，它不包含实际的源数据。你不能以这种方式做你想做的事；相反，您必须用 JavaScript 编写一个图像解码器（例如https://github.com/devongovett/png.js），它会输出到一个canvas元素中。
