Добавление изображения рядом с текстом в NestedList-Sencha Touch 2

Question

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

Я попытался изменить kithcensink код exapmle, Это мой nestedlist

Ext.require('Ext.data.TreeStore', function() { 
Ext.define('Kitchensink.view.NestedList', { 
    requires: ['Kitchensink.view.EditorPanel', 'Kitchensink.model.Kategori'], 
    extend: 'Ext.Container', 
    config: { 
     layout: 'fit', 
     items: [{ 
      xtype: 'nestedlist', 
      store: { 
       type: 'tree', 
       id: 'NestedListStore', 
       model: 'Kitchensink.model.Kategori', 
       root: {}, 
       proxy: { 
        type: 'ajax', 
        url: 'altkategoriler.json' 
       } 
      }, 

      displayField: 'text', 



      listeners: { 
       leafitemtap: function(me, list, index, item) { 
        var editorPanel = Ext.getCmp('editorPanel') || new Kitchensink.view.EditorPanel(); 
        editorPanel.setRecord(list.getStore().getAt(index)); 
        if (!editorPanel.getParent()) { 
         Ext.Viewport.add(editorPanel); 
        } 
        editorPanel.show(); 
       } 
      } 
     }] 
    } 
}); 

});

Я изменил магазин файл

var root = { 
     id: 'root', 
     text: 'Lezzet Dünyası', 
     items: [ 
      { 
       text: 'Ana Menü', 
       id: 'ui', 
       cls: 'launchscreen', 
       items: [ 
        { 
         text: 'Et Yemekleri', 
         leaf: true, 
         view:'NestedList3', 
         id: 'nestedlist3' 
        }, 
        { 
         text: 'Makarnalar', 
         leaf: true, 
         view: 'NestedList2', 
         id: 'nestedlist2' 
        }, 
        { 
         text: 'Tatlılar', 
         leaf: true, 
         view: 'NestedList4', 
         id: 'nestedlist4' 
        }, 
        { 
         text: 'Çorbalar', 
         view: 'NestedList', 
         leaf: true, 
         id: 'nestedlist' 
        } 
       ] 
      } 
     ] 
    }; 

Как следует изменить код, чтобы добавить изображение рядом с вложенным текстом списка?

Например, на сайте this вы можете увидеть пример вложенного списка, мне нужны изображения возле Blues, Jazz, Pop, Rock.

Answer 1

Как правило, вы можете сделать больше, чем то, что вам нужно по настройке getItemTextTpl (поместите его в ваш Ext.NestedList определение, например:.

getItemTextTpl: function(node) { 
    return '<span><img src="image_url" alt="alternative_text">{text}</span>'; 
} 

Определите любой шаблон вы хотите через эту возвращающей строку