extjsxtemplate三个相同级别的数组循环

我想在我的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);

var json={
名字：“汤姆”，
行标题学习者：['1'，'2'，]，
colTitleArr:[a'，'b']，
选项arr:['x'，'y']
}
var tpl=[
“{name}
”，
'',
“{.}
”，
'',
“---{.}
”，
'',
“----------{.}
”，
'',
'',
''
];
var tpl=新的Ext.XTemplate（tpl）；
tpl.overwrite（panel.body，json）；

结果是：
汤姆
--1
----a
----b
--2
----a
----b
我认为应该是：
--1
----a
--------x
--------y
----b
--------x
--------y
--2
----a
--------x
--------y
----b
--------x
--------y
...

---

为什么？

我实现这一点的唯一方法是将您的RowTitlear作为对象

您的exmaple无法工作，因为值中不知道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>'];

var数据={
姓名：“xxx”，
行标题学习者：[{number:'1'}，{number:'2'}，{number:'3'}]，
colTitleArr:[a'，b'，c']，
选项arr:['x'，'y']
};
var tpl=[
“{name}”，
“
”，
'',
'---{number}
'，
'',
'',
“-----------{.}
”，
'',
'-------------{.}
'，
'',
'',
''];

小提琴：

---

我已经做了一次测试，但结果还是不对！请在我的回复中查看我的测试结果！非常感谢。你是对的，之所以很难做到这一点，是因为你使用的是数组，不能只调用parent.parent。如果在开始循环之前准备好数据，或者使用一些模板函数，可能会更容易。