瞭解Jquery模板

Question

我正在閱讀並試圖瞭解一個Jquery模板示例。

<script id="movieTemplate" type="text/x-jquery-tmpl"> 
    {{tmpl "titleTemplate"}} 
    <tr class="detail"><td>Director: ${Director}</td></tr> 

</script> 

<table><tbody id="movieList"></tbody></table> 

<script> 
var movies = [ 
    { Name: "The Red Violin", Director: "François Girard" ,Producer : "ssss" }, 
    { Name: "Eyes Wide Shut", Director: "Stanley Kubrick" }, 
    { Name: "The Inheritance", Director: "Mauro Bolognini" } 
]; 

/* Convert the markup string into a named template, 
    referenced by the {{tmpl}} tag */ 
$.template("titleTemplate", "<tr class='title'><td>${Name}</td></tr>"); 

/* Render the movies data, using the named template as a nested template */ 
$("#movieTemplate").tmpl(movies).appendTo("#movieList"); 
</script> 

在這個例子中的程序，我無法理解有關：

/*轉換標記串入一個命名模板， 由{{TMPL}}標籤引用*/

當我們致電： $（「#movieTemplate」）.tmpl（電影），它是在調用模板上，我們呼籲與輸入電影的模板功能，並追加，要movieslistid

如果我刪除代碼

$.template("titleTemplate", "<tr class='title'><td>${Name}</td></tr>"); 

它不起作用。你能解釋爲什麼我們需要這個，它在做什麼這樣做是什麼：/ *將標記字符串轉換爲命名模板，意思是全部..

我試圖readonline，發現我沒有得到這個澄清

Answer 1

這包含了一個名爲"titleTemplate"模板的引用，這還沒有被定義的模板：

<script id="movieTemplate" type="text/x-jquery-tmpl"> 
    {{tmpl "titleTemplate"}} 
    <tr class="detail"><td>Director: ${Director}</td></tr> 
</script> 

此行定義模板失蹤：

$.template("titleTemplate", "<tr class='title'><td>${Name}</td></tr>"); 

這是另一種說法

<script id="titleTemplate" type="text/x-jquery-tmpl"> 
    <tr class='title'><td>${Name}</td></tr> 
</script> 

本質的例子表明，你可以用兩種方式

在HTML源代碼

• 聲明定義模板，<script type="text/x-jquery-tmpl">元素
• 編程方式從字符串通過$.template()