2

tpl!RequireJSのプラグインを使用して、テンプレートをアプリケーションにインポートしてコンパイルしていtext!ます。プラグインと同様です。

define([
    "tpl!../templates/newsfeed.html",
    "tpl!../templates/friends.html",
    "tpl!../templates/tag.html",
    "tpl!../templates/tags.html",
], function (renderNewsfeed, renderFriends, renderTag, renderTags) { … });

これはすべてうまくいきますが、理想的には何らかの形のパーシャルを使用したい段階に達しました。

現在、テンプレート内でテンプレートを使用する場合は、次のように、コンパイルされたパーシャルをレンダリングしているテンプレートに渡す必要があります。

$('body').append(renderTags({
    tags: tags,
    renderTag: renderTag
}));

次に、私のテンプレートでは：

<section class="tags-list">
    <h1 class="h4 hidden">Tags</h1>
    <% _.each(tags, function (tag) { %>
        <%= renderTag({ tag: tag }) %>
    <% }); %>
</section>

コンパイルされたパーシャルをテンプレートに渡さないと、それは見つかりません。

私の質問は、どうすればこれをより良くすることができるかということです。RequireJS定義で依存関係として定義したテンプレートが、テンプレート自体の可変スコープで（グローバルに）使用可能である場合、コンパイルされた部分をテンプレートに渡す必要はおそらくないでしょうか？

次に、RequireJSで使用できるのと同じ種類の依存関係定義がありますが、テンプレート用であると非常に便利です。

define([
    'tpl!../templates/tag.html'
], function (renderTag) {
    // Obviously this can't be straight HTML, but you get the idea
    <section class="tags-list">
        <h1 class="h4 hidden">Tags</h1>
        <% _.each(tags, function (tag) { %>
            <%= renderTag({ tag: tag }) %>
        <% }); %>
    </section>
});

私はここで完全に異なる惑星にいるかもしれません。もしそうなら、誰かがテンプレートの使い方を教えてください。おそらく、テンプレートエンジンを切り替える必要がありますか？

4

1 に答える 1

1

私が思いついた解決策は、実際にrequire()テンプレート内で使用して、必要なパーシャルをフェッチすることでした。たとえば、次のようになります。

<%
require([
    "tpl!../templates/partials/tags.html",
    "tpl!../templates/partials/spotify-search.html",
    "tpl!../templates/partials/popup.html"
], function (renderTags, renderSpotifySearch, renderPopup) { %>
    // Template code goes here
    // Partial example:
    <%= renderTags({ tags: tags }); %>
    <%
}); %>
于 2012-04-15T14:16:14.923 に答える