2014-01-06 18 views
9

私はjsrenderテンプレートを持っています。テンプレートがレンダリングされているとき、JavaScript関数を呼び出してデータを操作したいと思っています。JSRenderのjavascript関数を呼び出す

ここは私のJSRenderテンプレートです。

<tr class="template-download"> 
    <td class="size"> 
     <span>{{:size}}</span> 
    </td> 
</tr> 

は今、私はjavascript関数へ:size値を渡し、戻り値を取得したいです。だから私は:size値の代わりに戻り値を表示することができます。

マイJavaScript関数は

function getSize(size) { 
    var megabytes = size/(1024 * 1024); 
    return megabytes.toFixed(2) + "MB"; 
} 

私はこれをどのように行うことができますか?

答えて

16

あなたはヘルパー関数を使用してこれを行うことができます。あなたがレンダリング呼び出すと、あなたはテンプレート「に」ヘルパー関数を定義して渡すことができます。

$("#tmpl").render(data, 
        { getSize: function(size) { 
           var megabytes = size/(1024 * 1024); 
           return megabytes.toFixed(2) + "MB"; 
           } 
        } 
       ); 

次に、あなたのテンプレートで、あなたはこのようなヘルパー関数を呼び出す:

<tr class="template-download"> 
    <td class="size"> 
     <span>{{:size}} {{:~getSize(size)}} </span> 
    </td> 
</tr> 

を私はしましたあなたのテンプレートがどのように使用されているかについていくつかの仮定をしましたが、これはあなたを動かすはずです。

This articleにはヘルパー機能に関するセクションがあり、@ BorisMooreは彼のjsViews siteに多数の良い例があります。

+0

です。ありがとうございます - そのJsViewsサイトリンク(http://www.jsviews.com/#helpers)は、これに関する最新のドキュメントリンクです。 – BorisMoore

0

私はあなたがヘルパー機能を使用する必要がありますと信じています。以下の2つの参考文献を参照してください。 2番目は完全にフラッシュされた例です。

http://borismoore.github.io/jsrender/demos/step-by-step/09_helper-functions.html

+1

私もこれを見つけました:http://jsfiddle.net/jalalhejazi/Qzvdv/ – pedz

+0

こちらのドキュメントの最新のリンクはhttp://www.jsviews.com/#helpers – BorisMoore

関連する問題