在 sencha touch 2.1.0 中使用 XTemplate 循环数组

Question

Ext.XTemplate Docs 说：

tpl标签和for操作符用于处理提供的数据对象：

• 如果 for 中指定的值是一个数组，它将自动填充，为数组中的每个项目重复 tpl 标记内的模板块。
• 如果为=“。”指定，则检查提供的数据对象。
• 处理数组时，特殊变量 {#} 将提供当前数组索引 + 1（从 1 开始，而不是 0）。

我遵循第一条规则并将面板的数据配置分配给一个对象数组，但它只是显示一个空白。代码如下：

                  {
                 xtype : 'panel',
                 tpl : new Ext.XTemplate([
                          '<tpl>',
                            '<div>',
                                '{index}',
                            '</div>',
                          '</tpl>'
                 ]),
                 data : [
                         {index : '11'},
                         {index : '12'},
                         {index : '13'}
                 ]
              }

所以我遵循第二条规则并为'<tpl>' 添加'for="."'，它可以工作！所以，我想知道如果你只想用 Ext.XTemplate 循环一个数组，这是否真的意味着你必须添加一个 'for="."' ？

另外，使用'for="."' 语句真的是个坏习惯吗？

Answer 1

是的，<tpl for="."> 表示遍历“活动”对象。例如，“活动”对象从外部数组变为内部数组，因为在迭代期间我们指向内部数组：

var tpl = new Ext.XTemplate([
    '<tpl for=".">', // "." points to the outer array
        '<tpl for=".">', // "." points to each inner array
            '{.}',
        '</tpl>',
    '</tpl>'
]);

console.log(tpl.apply([
    [1, 2],
    [3, 4]
]));