简单的json商店对象没有在sencha touch 2中的子容器tpl中显示

Question

我正在使用sencha touch 2开发演示应用程序。我有列表屏幕，其中我使用jsonp下载数据并显示列表。现在点击列表行我打开新的详细信息屏幕，传递当前行存储对象。

在详细信息屏幕中，我能够获取对象并将其显示在主根容器上，但不会从子容器中显示相同的值。请参考下面的代码。

Ext.define('Demo.view.MyDetailView', {
extend: 'Ext.Container',

xtype:'mydetailview',

requires:[

     'Ext.TitleBar',         
     'Ext.dataview.List',
     'Ext.XTemplate'
 ],

config: {

    // code snippet-1 ********* it is working *********

    styleHtmlContent: true,
    scrollable:true,
    xtype: 'container',
    title:'Details',
    tpl: 'barname : {barname}',

    // ************** end **************

    items: [
        {
            xtype: 'titlebar',
            docked: 'top',
            title: 'Bar Info',
            items: [
                {
                    xtype: 'button',
                    ui: 'back',
                    text: 'Back',
                    id: 'btnBack'
                },
                {
                    xtype: 'button',
                    align: 'right',
                    text: 'Edit Beers'
                }
            ]
        },
        {
            xtype: 'container',
            layout: {
                type: 'hbox',
                pack: 'center'
            },
            items: [
                {
                    xtype: 'map',
                    height: 80,
                    margin: '10',
                    width: 80
                },
                {
                    xtype: 'container',
                    flex: 1,

                    layout: {
                        align: 'center',
                        pack: 'center',
                        type: 'hbox'
                    },
                    items: [
                        {

                            // code snippet-2 ********* it is NOT working *********

                            xtype: 'container',
                            styleHtmlContent: true,
                            tpl: 'barname : {barname}',      
                            //html: '<div>barname : {barname}</div>',
                            margin: '10 10 10 0',
                            width: '100%'

                            // ************** end **************
                        }
                    ]
                }
            ]
        }
    ]
}

}）;

在上面的代码中，“code snippet-1”正在工作，而相同的代码在内部容器tpl“code snippet-2”中不起作用。请指导我的代码有什么问题。如何在内部容器中使用“barname”。我也尝试用html代替tpl，这也是行不通的。

提前致谢...