2011-05-02 6 views
0

私は、JavaScriptのオブジェクトは次のように持っています。 ...jQuery.tmpl問題が

<ul class="days"> 
{{each Days}} 
    <li class="day {{if $value}}on{{else}}off{{/if}}">${$index + 1}</li> 
{{/each}} 
</ul> 

私は私だけLI要素とその周りの無いラップULのセットを取得

$("<ul class='days'>...</ul>").tmpl(data); 

を呼び出すと

何午前:私はするテンプレートを定義しました私はここで行方不明?

答えて

1

<script type="text/x-jquery-tmpl" id="daysTemplate"> 
    <ul class="days"> 
    {{each Days}} 
    <li class="day {{if $value}}on{{else}}off{{/if}}">${$index + 1}</li> 
    {{/each}} 
    </ul> 
</script> 

次に、そのようなテンプレートを選択してレンダリングします。

// You can inject the result into any container, using methods like appendTo() 
// html(), insert(), etc. 
$('#daysTemplate').tmpl(data).appendTo('body'); 
+0

あなたはそうです。愚かな私。私はいくつかの要素にテンプレートをラップする必要があります。 '

1

私はfiddle hereを作成しました。 テンプレート

<script id="daysTemplate" type="text/x-jquery-tmpl"> 
    <ul class="days"> 
    {{each Days}} 
     <li class="day {{if $value}}on{{else}}off{{/if}}">${$index + 1}</li> 
    {{/each}} 
    </ul> 
</script> 

スクリプト

あなたはこのように、(あなたがまだの場合) <script>要素にそのテンプレートコードを移動する必要が
var data = { 
    Id: 1, 
    Name: "Some name", 
    Days: [true, true, true, false, false, true, false] 
}; 
$("#daysTemplate").tmpl(data).appendTo('body'); 
+0

+1:テンプレートが正しく機能していると思います。しかし、主なことはタグにラップする必要があるということです(あなたの場合はスクリプトタグです)。 –