サンプル

公式の所で提示されていたものを使って表示させてみました。さて、うまく動くかお立ち会い…。

test1

元ネタ > RND - fast and simple JS template system

公式で出されていた奴。しっかりと動作します。

/***** サンプルその１ *****/ var tmpl = '<a href="%(link)">%(value|parseInt)</a>'; var name_space = {'link': 'http://amix.dk', 'value': 5.5}; var str=RND(tmpl, name_space); /** 出力 **/ document.getElementById("test1_1").innerHTML=str; document.getElementById("test1_2").appendChild(document.createTextNode(str));

実行結果

innerHTML
Text

解説

解説…まぁ、要は%(link)に指定した所にname_space.link内のデータであるhttp://amix.dkが、%(value|parseInt)に指定した所にname_space.value内のデータである5.5が整数で出力されているというサンプルですね。

test2

元ネタ > RND template redux

パワーアップ版のテスト用に提示されていた奴

/***** サンプルその２ *****/ var tmpl = '<a href="%(link)">%(value|timesTwo)</a>'; var name_space = {link: 'http://amix.dk', value: 5.5}; var myfn = { timesTwo: function(v) { return v*2; } } var str=RND(tmpl, name_space, myfn); /** 出力 **/ document.getElementById("test2_1").innerHTML=str; document.getElementById("test2_2").appendChild(document.createTextNode(str));

実行結果

innerHTML
Text

解説

解説…まぁ、要は%(link)に指定した所にname_space.link内のデータであるhttp://amix.dkが、%(value|timesTwo)に指定した所にname_space.value内のデータである5.5が一緒に定義されたmyfn.TimesTwoにより変換されて出力されているというサンプルですね。

本体:RND template Engine

動くだろうか？私の方で観た限り、まともに出力出来ない気がする。riaf様のお陰で公式の所の文字が何らかの関係で消えている事が判明、修正することによって正常に動作しました。有難う御座います。

/***** RND template Engine *****/ function RND(tmpl, ns, scope) { scope = scope || window; var fn = function(w, g) { g = g.split("|"); var cnt = ns[g[0]]; for(var i=1; i < g.length; i++) cnt = scope[g[i]](cnt); if(cnt == 0 || cnt == -1) cnt += ''; return cnt || w; }; return tmpl.replace(/%\(([A-Za-z0-9_|.]+)\)/g, fn); }

皆さんが観ての通り、しっかりと動作します。

修正点

正規表現廻りのみ修正しました。（指摘したのはriaf様。

return tmpl.replace(/%(([A-Za-z0-9_|.]))/g, fn);

多分‘\’と‘+’が何らかの原因で消されたンだろうな…。なので正しくは以下の。

return tmpl.replace(/%\(([A-Za-z0-9_|.]+)\)/g, fn);

こうなる訳です。…ってか新版の方で…修正されては居なかったみたいです。+が無いから動かない模様。

公式の所の新版の方では修正版のコメントが幾つかあるようなのですが、%()は有りの方が良いでしょうか？jsonでそれは出来ない気がしますが…。なので此処では*ではなく+を使う事にしています。

更新履歴

2008/11/15

よく見たら新版の方で修正されている様な気がするるる…orz てか、何で旧版にリンク貼る人が多いのかが気になる…きっと古い事だからか？まぁ（新版なら）使えるから良いか。でも実質旧版でも新版でも動かなかった!!‘+’が無いから!!

2008/11/14

動いた。riaf様のお陰で動いた！どうも正規表現が公式の所でエスケープの関係でイっていたらしい。

2008/11/13

設置してみた。でも何だか動かない。ナンデダロ。