web-dev-qa-db-ja.com

jQueryをロード-外部ファイルからテンプレート?

JQueryのテンプレートエンジンを使い始めたところです。これは今のところかなりいい感じです。それでも、どういうわけか外部ファイルからテンプレートをロードすることは可能かどうか疑問に思います。たくさんのテンプレートがあると想像してみてください。これはhtmlコードを台無しにし、キャッシュ可能ではなく、リクエストごとにダウンロードする必要があります。

それらすべてを外部ファイルで定義し、それらをロードして、コンパイルされたテンプレートをlocalStorageに保存する方法があることを望んでいました。

誰かが外部ファイルからそれらをロードする方法を知っていますか?

24
Nils Riedemann

このテンプレートは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>

テンプレートを1回だけロードする場合は、ロードされたテンプレートのローカルストレージロジックまたは配列を追加できます。

15
Floyd

Litle libをajaxレンダリングhtmlのjQueryプラグインとして、ブラウザーでindexDBキャッシングを使用してappearブロックに記述しました jQuery HTML Template Loader

1
moledet

私は最近、これを支援するためにjavascriptライブラリを作成しました。

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

<link>タグを使用してjsRenderまたはその他の種類のテンプレートファイルを追加すると、それらは自動的に登録されます。

0
Steven Hunt