Question

我正在尝试使用$ http.get加载一个图像，因为它稍后会来自服务器，我真的不知道该怎么做：/

我现在的代码是：

在服务中，我得到这样的结果：

return $http.get('resources/mock-data/image.jpg', {
      headers: {
        'Content-Type': 'image/jpg'
      }
    });

返回一个promisse，它带有这样的二进制数据： JFIF （％！1！％），... 383,7（ - 。+

，$＆安培; ,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,, ,,,, K！1AQ“aq 2 BRr ＃3b $4S Ccst 5D ＆lt;！1AQ “aq23Br＃$ 4bCR？ Ԑ-O GT; vJ4＆GT;aWs̯I＆安培;ϻslZ.6 - rRhK; ֮ T！ k R [MuwEKOC P（LJ nUjul5mv＆GT;}ԙҺʵڸXC] + Ո （$（（ s{ g y 0 w' ＃^d i kI＆gt; 'WJpJQ ^ }： CG＃ G ^ 5Nv＆LT;ҡifJkul96zKe| Z W） “：jLqUxb9RVg5 （jI5A V \˚F\ 14G 9 （ h k9 ＃H + 1 sȂ K @ { \ W）T]＃ m Ӕ U _ B= ＆amp; ;aΘxl]nΛfX_2y8Q4\ + O0〜吨;！K ^ + 5 _HUQvk＆安培;;RVóIx] 2ڟ乙 Ԑ％（@ ， E：5＆amp;.P {R IŘ R：8 |4 H 0XW r 5 l g G p l Ǜ1 V 0 {' C＃M〜I＆GT;Iÿ0 - }＆LT; 5VJTvf3b ;！Vg3P @@ ％/ LK Sᔂʘx59= P-ٽ MQE（K％] Z [wgѾ+％ML8 ^ Vn的！@қ

这只是它的一部分......它的长度是12500 ......

控制器上的

我会这样解析为base64：

var base64 = 'data:image/jpg;base64,' + btoa(unescape(encodeURIComponent(image.data)))
  console.log(base64);
  $scope.fullImage = base64;

其中图像是promisse的响应，数据是我上面推荐的二进制文件的位置。

我的观点如下：

  <img ng-src="{{fullImage}}" class="coolin_home_full_image"/>

所以，任何人都知道如何解决这个问题

Answer 1

我终于明白了它是什么。

我在没有标题的情况下调用了$ http get，所以它没有给我返回一个bufferArray而是一个字符串，我修复了：

var deferred = $q.defer();
    var promise = deferred.promise;
    $http.get('resources/mock-data/image.jpg', {}, {
      headers: {
        'Content-Type': 'image/jpg'
      },
      responseType: 'blob'
    }).then(function(image) {
      var blob = new Blob([image.data], {
        type: 'image/jpeg'
      });
      var fr = new FileReader();
      fr.onload = function() {
        deferred.resolve(fr.result);
      };
      fr.readAsDataURL(blob);
    }, function(error) {
      deferred.reject(error);
    });

    return promise;

然后在控制器中你只调用promise的返回并抛出一个类似

的img

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

$ http.get从jpg到img

1 个答案: