2

我在看下面的视频,想知道是否可以制作一个递归模板来输出 DOM 中任何对象的所有属性/方法名称?--
http://dev.sencha.com/deploy/ext-4.1.0-gpl/docs/index.html#!/video/17905336

这是一个纯 javascript 示例,我对在 extjs 中使用 XTemplate 感到好奇——http: //jsfiddle.net/SLJZ3/

var mObj = {};
mObj.mArr = [];
mObj.mArr.push({id:['id1','id2','id3']});
mObj.mArr.push({days:['Monday','Tuesday','Wednesday','Thursday']});
mObj.mArr.push({colors:['orange','red','blue','green','yellow','white']});
mObj.mArr.push(function isTrue(){return true;});

function r(obj) {
    if (obj)
        for (var key in obj) {
            if (typeof obj[key] == "object")
                r(obj[key]);
            else if (typeof obj[key] == "function")
              document.writeln("<span style='color:silver'>" + obj[key] + "</span><br/>");
            else if (typeof obj[key] != "function")
                document.writeln(obj[key] + "<br/>")
        }

    return;
} 

r(mObj);​
4

1 回答 1

1

XTemplate允许在模板中执行自定义函数甚至任意内联代码(请参阅链接文档页面中的相应部分),所以我想从技术上讲,您可以从 XTemplate 中调用递归函数,但这并不比直接调用递归函数更好。

我在这里看到了您的想法 - 将标记带到您的输出函数之外,但如果您想迭代一个对象,恐怕 XTemplate 不会很有帮助,因为它只有用于迭代数组的构造。

“自动填充数组”中的示例说:

<tpl for=".">...</tpl>       // loop through array at root node

所以你只能写这样的模板:

<p>Name: {name}</p>
<tpl for="days">
    ...iterate days array
</tpl>
<tpl for="colors">
    ...iterate colors array
</tpl>

那就是当您知道数据对象中应该有哪些属性时。

或者,您可以为输出的不同类型的数据定义单独的模板。

于 2012-06-26T14:52:44.817 回答