extjs - Extjs XTemplate 三个同级数组循环

Question

我想在我的 extjs 代码中同时循环三个数组，但它不起作用！我一直在测试，两个数组的结果还可以，但是三个数组不起作用！

var json = {
    name : 'tom',
    rowTitleArr : ['1','2'],
    colTitleArr : ['a','b'],
    optionArr : ['x','y']
}
var tpl = [
    '{name}<br>',
    '<tpl for="rowTitleArr">',
        '--{.}<br>',
        '<tpl for="parent.colTitleArr">',
            '----{.}<br>',
            '<tpl for="parent.parent.optionArr">',
                '--------{.}<br>',
             '</tpl>',
        '</tpl>',
    '<tpl>'
];
var tpl = new Ext.XTemplate(tpl);
tpl.overwrite(panel.body,json);

结果是：
tom
--1
----a
----b
--2
----a
----b
我认为应该是：
--1
----a
---- ----x
--------y
----b
--------x
--------y
--2
----a
----- ---x
--------y
----b
--------x
--------y
...为什么？

Answer 1

我得到这个工作的唯一方法是将你的 rowTitleArr 作为一个对象。

您的示例不起作用，因为值中不知道 parent.parent。您可以使用模板执行功能对其进行设置。

var data = {
        name: 'xxx',
        rowTitleArr: [{number:'1'},{number:'2'},{number:'3'}],
        colTitleArr: ['a', 'b', 'c'],
        optionArr : ['x','y']
    };
    var tpl = [
        '{name}',
        '<br/>',
        '<tpl for="rowTitleArr">',
        '----{number}<br>',
        '<tpl exec="values.parent = parent;"></tpl>',
            '<tpl for="parent.colTitleArr">',
        '---------{.}<br>',                    
                    '<tpl for="parent.parent.optionArr">',
                '----------------{.}<br>',
             '</tpl>',
            '</tpl>',
        '</tpl>'];

小提琴：http: //jsfiddle.net/johanhaest/2WEVE/1/