AngularJS - Показать содержимое байтового массива как изображение

Я ищу в моей базе данных изображение в виде байтового массива. Я хочу показать это содержимое в виде файла с использованием разметкиобраз, но это не такздесь не работает

// 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
  
<img src="{{image}}">  
  
<img ng-src="{{image}}">  

Любая идея? Спасибо вам всем!

Ответы на вопрос(4)

Убедитесь, что данные, которые вы возвращаете для отображения в виде изображения, конвертируются в ToBase64String

В вашем коде C # используйте Convert.ToBase64String (imageBytes) и в представлении используйте это

src атрибутimg указывает на исходный файл изображения, он нет содержит фактические исходные данные. Вы можете'делай так, как хочешь; вместо этого вам придется написать декодер изображений на JavaScript (например,https://github.com/devongovett/png.js), который выводит вcanvas элемент.

Решение Вопроса

использованиеng-src в следующем формате

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

Дон»не забудьте добавить фильтр очистки дляdata не отмечаться какunsafe по угловой:

$compileProvider.aHrefSanitizationWhitelist(/^\s*(https?|file|ftp|blob):|data:image\//);
 amdev05 авг. 2016 г., 11:34
ПОЛУЧИТЬ данные: image / PNG; base64 и т. Д. Net :: ERR_INVALID_URL для меня
 amdev04 мая 2017 г., 16:23
@Hema, да на самом деле я думаю, что проблема была в стороне Java. Теперь на лицевой стороне у меня есть <img ng-src = "данные: изображения / PNG; base64, {{myresponsejsonobject.image}} "> и Java, у меня есть объект ByteArrayOutputStream, который я конвертирую в b64, как этот byte [] imageBytes = baos.toByteArray (); String b64 = Base64.encodeBase64String (imageBytes); baos.close (); Затем поместите мою строку в JSON.
 Ciaran Gallagher18 авг. 2017 г., 23:42
Привет @ Assem-Hafez, где следует добавить фильтр для очистки?
 Assem-Hafez24 авг. 2017 г., 03:19
@CiaranGallagher это должно быть в вашей конфигурации angular.module ('MYAPP») .Config ([»$ CompileProvider», function ($ compileProvider) {$ compileProvider.aHrefSanitizationWhitelist (/ ^ \ s * (https? | file | ftp | blob): | data: image \ //); }]);
 Hema04 мая 2017 г., 14:03
@amdev, ты решил это?
 R2D205 окт. 2017 г., 16:17
Получить изображение из функции <img ng-src = "данные: изображение / JPEG; base64, {{GetImage (»dynamicbehaviour»)}} ">
 Hema04 мая 2017 г., 14:02
@ Assem, даже я получаю чистый :: ERR_INVALID_URL. В чем может быть проблема.

Если вы можете заставить свой сервер возвращать изображение в кодированной строке base64, вы можете использоватьURL данных как атрибут src.

Ваш ответ на вопрос