Sencha Touch:从数据库显示图像

时间:2013-07-26 12:47:30

标签: extjs sencha-touch sencha-touch-2 base64

我是Sencha Touch的新手,我正试图在视图中显示图像。图像的来源是我模型的一个字段,并且是base64字符串格式。我需要将此字段分配给图像src。当我尝试在图像中设置静态基础64内容时,它工作正常,但是当我尝试通过分配字段动态分配时,视图为空。

请参阅以下代码

基于图像base64的内容将出现在“附件”

字段中

我的观看代码

 Ext.define('TechHelp.view.ViewAttachment',
            {
                xtype : 'viewattachment',
                  extend : "Ext.form.Panel",
                requires :"Ext.form.FieldSet" ,

      config : {
                    //styleHtmlContent : true,
                    scrollable : 'vertical',
                    title : 'Attachments',
    items : [{
        xtype : "image",
       name : 'attachment',
       src: 'data:image/jpeg;base64,'+'Attachment',
           height:'100px',
       width: '100px'
}, ]
 },

 });

我的模型代码

Ext.define('TechHelp.model.Attachment',{     extend:'Ext.data.Model',

config: {
    // define the fields. the default type is string

    fields:// ['customerId','FirstName'],
          [{name:'AttachmentId'},
           {name:'TicketId'},
           {name:'Attachment'},
           {name:'FileName'},
           ],

},

});

请帮忙。

1 个答案:

答案 0 :(得分:1)

您应该将数据设置为视图,然后使用tpl打印值:

控制器:

var itemView = Ext.create('TechHelp.view.ViewAttachment');
itemView.setRecord(record);

视图:

config : {
    scrollable : 'vertical',
    title : 'Attachments',
    tpl: '<img src="data:image/jpeg;base64,{Attachment}" />'
    ....
},

updateRecord: function(record) {
    if (record) this.setData(record.data);
}
希望它有所帮助 -