I cannot pass data from controller to a view in Sencha Touch 2.4

Question

I have tried some different things but I was unable to pass data from controller to view (to a component inside a container).

Here I have the view ServisDetail.js:

Ext.define('Asistan.view.ServisDetail', {
    extend: 'Ext.Container',
    xtype: 'servisDetail',
    config: {
        layout: 'fit',
        items : [
            {
                xclass : 'Asistan.view.ServisToolbar'
            },
            {
                // "data: {}" is needed to work. I try to pass data from controller to here
                xtype: 'component',
                tpl: Ext.create('Ext.XTemplate','{URUN_CIHAZ_ADI} jkjk')
            }
        ]
    }
});

And here is my controller Servis.js which I think thought that it should work. But it doesn't pass the data:

Ext.define('Asistan.controller.Servis', {
    extend: 'Ext.app.Controller',
    config: {
        refs: {
            servis: 'servisNavigationView servisContainer list',
        },
        control: {
            servis: {
                itemdoubletap: 'showServis'
            }
        }
    },
    showServis: function(item, index, e, eOpts) {
        this.servis = Ext.widget('servisDetail');
        this.servis.config.items[1].data = eOpts.data; // <- Here! It doesn't work. console.log shows that the data is there but in the browser the data doesn't show up.
        console.log(this.servis.config.items[1].data); // I can see my data here, right before the push
        item.up('servisNavigationView').push(this.servis);
    }
});

What I am missing?

Answer 1

The item with tpl should have an id.

{
    id: 'itemWithTpl', // <- here
    xtype: 'component',
    tpl: Ext.create('Ext.XTemplate','{URUN_CIHAZ_ADI} jkjk')
}

And the controller:

showServis: function(item, index, target, record, e, eOpts) {
    this.servis = Ext.widget('servisDetail');
    item.up('servisNavigationView').push(this.servis);
    Ext.getCmp('itemWithTpl').setData(record.data); // <- here
}

Answer 2

Try using

showServis: function(item, index, e, eOpts) {
    this.servis = Ext.widget('servisDetail');
    this.servis.setData(eOpts.data);  // setData applies the data to the container template.
    item.up('servisNavigationView').push(this.servis);
}