2011-12-14 12 views
6

ネストされたjQueryテンプレートを使用してJSONデータを表に表示しようとしています。jQueryテンプレートのネスト

私は最初のレベルまでしか動かすことができません。

は、ここで私が達成しようとしているものの例です:

Clientは、OrdersとFullnameのリストを持っています。これはclientTemplateorderTemplateを使用して表示されます。その時点まで、すべて正常に動作します。

今、OrderProductsのリストを持っています。だからorderTemplateからproductTemplateを呼び出しています。そして、データがバインドされていない:(

私はこれは私がproductTemplate$data$dataを渡しているためであるトップレベルのオブジェクト(Client)を指し推測している。しかし、どのように私は、現在ご注文を渡すのですか?ここで

は私のテンプレートです:

<script id="clientTemplate" type="text/x-jquery-tmpl"> 
    <tr><td>Fullname</td></tr> 
    <tr><td>${Fullname}</td></tr>   
    <tr> 
     <td> 
      <table> 
      <tr><td>Order Id</td><td>Order Date</td></tr> 
      {{tmpl($data) "#orderTemplate"}}    
      </table> 
     </td> 
    </tr> 
    </script> 

    <script id="orderTemplate" type="text/x-jquery-tmpl"> 
    {{each Orders}} 
     <tr> 
      <td>${Id}</td> 
      <td>${DateOrder}</td>        
     </tr> 
     <tr> 
     <td> 
      <table> 
      <tr><td>Product Id</td><td>Quantity</td></tr> 
      {{tmpl($data) "#productTemplate"}} 
      </table 
     </td> 
     </tr> 
    {{/each}} 
    </script> 

    <script id="productTemplate" type="text/x-jquery-tmpl"> 
    {{each ProductList}} 
     <tr> 
      <td>${Id}</td> 
      <td>${Quantity}</td> 
     </tr> 
    {{/each}} 
    </script> 

答えて

3

{{each}}のコンテキスト内では、反復項目を参照するために$valueの代わり$dataを使用する必要があります。

{{tmpl($value) "#productTemplate"}} 
+0

私はそれを知らなかった!助けてくれてありがとう:) – Sam

関連する問題