如何在jsRender中使用javascript變量？

Question

我想用如下。

<script id="movieTemplate" type="text/x-jquery-tmpl"> 
    <tr> 
     <td>{{=Title}}</td> 
     <td> 
      {{* var title = $ctx.GetTitleFunction($view);}} 
      {{#each Languages}} 
       <div>     
        <em>{{=Name}}</em> 
        <em>({{* title;}})</em> 
       </div> 
      {{/each}} 
     </td> 
    </tr> 
</script> 

<script type="text/javascript"> 

    function GetTitle(data){ 
     return "Title : " + data.Title; 
    } 

    var movies = [ 
     { 
      Title: "Meet Joe Black", 
      Languages: [ 
       { Name: "English" }, 
       { Name: "French" } 
      ] 
     }, 
     { 
      Title: "Eyes Wide Shut", 
      Languages: [ 
       { Name: "French" }, 
       { Name: "Mandarin" }, 
       { Name: "Spanish" } 
      ] 
     } 
    ]; 

    $.views.allowCode = true; 
    $.views.registerHelpers({ GetTitleFunction: GetTitle }); 
    $("#movieList").html(
     $("#movieTemplate").render(movies) 
    ); 

</script> 

我無法使用{{* title;}}或{{* = title}}來呈現JavaScript變量。
如何在JavaScript變量中呈現值？

Answer 1

我創建了一個小提示，向您展示如何使用幫助函數返回標題。它使用新的beta候選語法結合了助手函數和視圖路徑。我不需要使用allowCode來執行此操作... allowCode讓我們定義變量和流程邏輯，但是它沒有完全訪問給定的javascript（爲了安全起見）。無論如何，我認爲的代碼是沒有allowCode乾淨多了，但你撥打電話:)

http://jsfiddle.net/johnpapa/LqchY/

注意，從鮑里斯後的新變化：http://www.borismoore.com/2012/03/approaching-beta-whats-changing-in_06.html

下面的代碼具有這些顯着的變化：

1. 新的語法是使用{{：yourProperty}}來呈現屬性值。
2. {{#each}}已被替換{{爲}}現在
3. 輔助功能都和蒂爾達引用〜代替CTX
4. 當一個for循環裏面，你可以通過訪問父上下文＃view.parent或只是#parent（因爲視圖是隱含的）。所以在一個數組循環中，你必須有一個父進入你的數組，另一個父進入你的數組的父進程，並且數據爲你提供數據。它有點冗長，但它允許你有權訪問上下文。 {{：＃parent.parent.data.Title}}
5. [已更新]您可以傳入要使用的數據，也可以訪問函數內部的view.data。

我希望這有助於！

<script id="movieTemplate" type="text/x-jsrender"> 
    <tr> 
     <td>{{:Title}}</td> 
     <td> 
      <!-- Use the helper function to display the title --> 
      {{:~GetTitleFunction()}} 
      {{for Languages}} 
       <div>     
        <em>{{:Name}}</em> 
        <!-- Use the view path for parent. could also do #view.parent.parent.data --> 
        <em>({{:#parent.parent.data.Title}})</em> 
        <!-- Use the helper function and view path --> 
        <em>{{:~GetTitleFunction(#parent.parent.data)}}</em> 
       </div> 
      {{/for}} 
     </td> 
    </tr> 
</script>