jQuery.tmpl問題陣列類型屬性

我有Javascript對象像：jQuery.tmpl問題陣列類型屬性

var data = { 
    Id: 1, 
    Name: "Some name", 
    Days: [true, true, true, false, false, true, false] 
};

在客戶端上產生的這些目的和我想要通過使用jQuery.tmpl插件來可視化。我定義的模板是：

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

當我打電話

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

我只得到了一組LI元素和他們周圍沒有包裝UL的...

上午什麼我錯過了嗎？

來源

2011-05-02 Robert Koritnik

您需要在模板代碼移到<script>元素（如果你還沒有的話），就像這樣：

<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');

來源

2011-05-02 17:01:10

你說得對。傻我。我必須將我的模板包裹到某個元素中。 '

我創建了一個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>

腳本

var data = { 
    Id: 1, 
    Name: "Some name", 
    Days: [true, true, true, false, false, true, false] 
}; 
$("#daysTemplate").tmpl(data).appendTo('body');

來源

2011-05-02 16:53:35

+1：當你說我的模板有效時，你是對的。但最重要的是它必須包裝成一個標籤（在你的情況下它是腳本標籤）。 – 2011-05-02 17:08:58

相關問題

jQuery.tmpl問題陣列類型屬性

回答

相關問題