Question

我使用Base64编码从服务器获取图像。

我的Base64响应是正确的。在客户端，我使用以下内容：

var blob = base64ToBlob(content, {type: 'image/jpeg'});
            URL = window.URL || window.webkitURL;
            var blobUrl = URL.createObjectURL(blob);
            //Displaying image in div works.
            var elImage = $("#dbimage");
            elImage.append("<img src='data:image/jpeg;base64," + content+ " '/>");
            ///This doesn;t work.
            return blobUrl;

var base64ToBlob = function(base64) {
  var binary = atob(base64);
  var len = binary.length;
  var buffer = new ArrayBuffer(len);
  var view = new Uint8Array(buffer);
  for (var i = 0; i < len; i++) {
    view[i] = binary.charCodeAt(i);
  }
  return new Blob([view], {type: 'image/jpeg'});
};

我将blobURL返回给HandleBar模板。它似乎没有识别出斑点。

此转换封装在承诺中。在HandleBar模板中，我写的是这样的：

<img  {{bind-attr src=image.content}}  />

此承诺存在于image属性中。 div中显示的图像工作正常，但blob中的图像不显示。

编辑：

我正在回复承诺，就像这样：

image : function() {
var promise =  jQuery.ajax({
        url: '/getattachments/?id=' + this.id + "&name=" + docname,
       contentType: 'image/jpeg',
        type: 'GET',
        processData : false,
        success: function(content) {
            var blob = base64ToBlob(content, { type: 'image/jpeg'} );
           URL = window.URL || window.webkitURL;
            var blobUrl = URL.createObjectURL(blob);
            return blobUrl;                
        },
       error : function(content)
       {
           Em.Logger.info('Model:', this.id, 'has no image', err);
           return '';
        }
       return DS.PromiseObject.create({ promise: promise });
      }.property('_attachments'),
    });

帮助。

感谢。

Answer 1

在您提供的特定答案中，有一些小问题。

属性需要是计算属性，而不仅仅是函数

foo: function(){

}.property()  // <-------this here

此外，您使用的是Ember Data（DS命名空间）的一部分，它不是Ember的一部分，它是一个单独的产品。这很好，但是如果您要使用该文件，则需要包含该文件。

由于promise是返回直接文本而不是对象，因此您需要连接到promise对象的content属性。

<img {{bind-attr src=img.content}}/>

http://emberjs.jsbin.com/qiyodojo/8/edit

Ember - HandleBar不显示blob图像

1 个答案: