Question

我写了一个api服务，从$ http获取二进制数据。问题是我不知道如何使用该数据来显示图像。 PS：二进制数据实际上是一个图像。

这是我的服务api

getAvatar: function() {
    return $http({
      method  : 'GET',
      url     : 'domain.com',
      headers : {'Content-Type' : 'application/json'}
    });
  }

我的控制器

//get avatar
$scope.userAvatar = function() {
    Api.getAvatar()
    .then(function(result) {
        //success
        console.log(result.data); //this is the binary data
        $scope.avatarImage = result.data;
        }

    }, function(result) {
        //errors
    });

};

起初我认为api会给我的结果是一个网址，但结果是二进制文件。我必须先转换它吗？

Answer 1

我认为您的服务可能会返回base64 encoded string of data的任何图像，然后将其绑定到控制器中的avatarImage。

然后简单地用html写：

<img ng-src="{{avatarImage}}"/>

Answer 2

您可以通过创建新的图像元素

来完成此操作

$img=$("<img src='data:image/gif;base64,"+result.data+"'/>"); //Assuming that the image was encoded as base64. Try this

$elem.append($img)无论你想插入它还是

Answer 3

Chek out ngSrc

这是一个例子：

 <div ng-controller="Cont">
      <img ng-src="{{imageSource}}">
 </div>

如何读取angularjs中的二进制数据

3 个答案: