Render customize component inside XTemplate

问题

Ext.define('GB.view.DigestList',{
    extend: 'Ext.panel.Panel',
    alias:'widget.digestlist',

            items:[ {
                xtype:'dataview',
                store: 'GB.store.Digests',
                tpl: new Ext.XTemplate(
                          '<tpl for=".">',
                            '<div class="container">',
                              '{name}',
                              '<div class="davidfun"></div>',
                            '</div>',
                          '</tpl>'
                ),      
                listeners: {
                    viewready: function(){
                        var home_d = Ext.create('GB.view.MyOwnDigest');
                        home_d.render(Ext.query('.davidfun')[0]);
                        // home_d.render(Ext.getBody()); <- it'll work fine with this line
                    },
                }
              }],

    bind: function(record, store) {
        this.getComponent(0).bindStore(record);
    }

});


Ext.define('GB.store.Digests', {
    extend:'Ext.data.Store',
    model: 'GB.model.Digest',
    data:[
        {'name':'name111'},
        {'name':'name222'}
    ]
});

Does someone know why can't i get div class which is "davidfun" that in Xtemplate by Ext.query('.davidfun')[0],

it'll always show 'undefined', thanks for your response first:)

Code UPDATE:

Problem resolved!

回答1:

You can try the "viewready" event of the dataview.

See my example http://jsfiddle.net/2huvt/

来源：https://stackoverflow.com/questions/12597830/render-customize-component-inside-xtemplate