具有模板的Sencha Touch 2面板包括数据和对象

Question

我想知道是否可以在Sencha Touch 2中包含两个数据并在模板中创建一个新对象？

我有以下代码：

Ext.define('MyApp.view.VideosDetail', {
extend: 'Ext.Panel',
xtype: 'videosdetail',

config: {
    title: 'Details',
    styleHtmlContent: true,
    scrollable: 'vertical',
    tpl: [
        '{content}',
        {
            xtype: 'video',
            width: 400,
            height: 400,
            url: '{link}'
        }
    ]
}
});

我看到[object Object]而不是带有链接网址的视频对象。

{content}通过商店等正常工作。

Answer 1

好的，你要记住两件事

1. 你不能以你刚才的方式在tpl中使用复杂的对象。在Sencha Touch中，在tpl字符串之后添加“，”后跟“{。}。”意味着向XTemplate添加成员函数或配置。在这种情况下，ST误解了你的对象是各种各样的成员函数，并且由于你没有调用任何函数而没有显示任何内容。

成员函数示例::

var tpl = new Ext.XTemplate(
'<p>Name: {name}</p>',
'<p>Kids: ',
'<tpl for="kids">',
    '<tpl if="this.isGirl(name)">',
        '<p>Girl: {name} - {age}</p>',
    '<tpl else>',
        '<p>Boy: {name} - {age}</p>',
    '</tpl>',
    '<tpl if="this.isBaby(age)">',
        '<p>{name} is a baby!</p>',
    '</tpl>',
'</tpl></p>',
{
    // XTemplate configuration:
    disableFormats: true,
    // member functions:
    isGirl: function(name){
       return name == 'Sara Grace';
    },
    isBaby: function(age){
       return age < 1;
    }
}
);

1. 如果您有一个复杂的tpl对象，请始终尝试创建一个单独的XTemplate对象，这将使您的代码简单而美观（即易于阅读）

2. 我之前做过类似的事情，并在我的XTemplate中添加了视频。但我没有使用过视频对象。相反，我创建的tpl看起来如下::

   

在我的场景中，我视频的网址由两部分组成，vurl1是常见的，如“www.youtube.com/watch？”并且vcode1是随后的动态代码。