Sencha Touch: как получить конфигурацию от tpl?

Question

С Sencha Touch я создал компонент для отображения таблицы для моего мобильного приложения.

Вот мой код компонента:

Ext.define('MyApp.components.table.Table', { 
    extend: 'Ext.Container', 
    xtype: 'table', 

    config: { 
    cls: 'myTableCSS', 
    scrollable: 'vertical', 
    tpl: Ext.create('Ext.XTemplate', 
     '<tpl for=".">', 
      '<table>', 
       '<tr>', 
        '<tpl for="headers">', 
         '<th>{html}</th>', 
        '</tpl>', 
       '</tr>', 
       '<tpl for="rows">', 
        '<tr class="{[this.config.id]}" >', 
         '<tpl for="columns">', 
           '<td>{html}</td>', 
         '</tpl>', 
        '</tr>', 
       '</tpl>', 
      '</table>', 
     '</tpl>' 
    } 
}); 

Вот моя реализация вида:

xtype: 'table', 
id: 'myRedTable', 
data: [ 
    { 
     headers: [ 
      { html: 'firstname' }, 
      { html: 'lastname' }, 
      { html: 'age' } 
     ], 
     rows: [ 
      { 
       columns: [ 
        { html: 'John' }, 
        { html: 'Smith' }, 
        { html: '38' }, 
       ] 
      } 
     ] 
    } 
], 

В моем компоненте, когда я использую {[this.config.id]} Я хотел бы получить идентификатор моей реализации зрения (т.е. myRedTable), но это не сработает.

Есть ли решение для достижения этой цели?

Answer 1

Кажется, вы правильно написали синтаксис для встроенного произвольного кода, но есть проблема с областью видимости. this относится к экземпляру Ext.XTemplate, а не к виду таблицы.

Вы должны попробовать другой способ получить ссылку на экземпляр таблицы вместо этого, например, в файле определения вашей таблицы:

initialize: function(){ 
    var me = this; 
    me.setTpl('Ext.XTemplate', 
     // blah blah ... 
     // now you can use "me" to refer to your table instance 
    ) 
}