2

次のビデオを見ていて、再帰的なテンプレートを作成して、DOM 内の任意のオブジェクトのすべてのプロパティ/メソッド名を出力できるかどうか疑問に思いました。--
http://dev.sencha.com/deploy/ext-4.1.0-gpl/docs/index.html#!/video/17905336

これは、extjs で XTemplate を使用して行うことに興味がある純粋な JavaScript の例です -- 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 に答える