從外部文件加載jQuery模板？

Question

我剛開始使用jQuery的模板引擎。目前看起來相當不錯。但我想知道是否有可能以某種方式從外部文件加載模板。想象一下有大量的模板。這會弄亂html代碼，並且也不可緩存，並且必須在每個請求中下載。

我希望有一種方法可以在外部文件中定義它們，然後加載它們並將編譯後的模板存儲到localStorage中。

有沒有人有一個想法如何從外部文件加載它們？

Answer 1

您可以使用ajax加載此模板。

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

    $.get("templates/movieTemplate.html", function(data, textStatus, XMLHttpRequest){ 
    var markup = data; //"<tr><td colspan='2'>${Name}</td><td>Released: ${ReleaseYear}</td><td>Director: ${Director}</td></tr>" 

    /* Compile markup string as a named template */ 
    $.template("movieTemplate", markup); 

    /* Render the named template */ 
    $.tmpl("movieTemplate", movies).appendTo("#movieList"); 
    }); 
</script> 

如果您只想加載任何模板一次，您現在可以爲加載的模板添加localstorage邏輯或數組。

Answer 2

我最近寫了一個JavaScript庫，以協助這一點：

https://www.github.com/stevenmhunt/tmpl.loader

您可以添加jsRender或任何其他形式的使用<link>標籤模板文件和他們自動註冊。

Answer 3

我寫了痘痘的lib作爲jQuery插件的ajax呈現在瀏覽器中jQuery HTML Template Loader