2012-04-11 5 views
2
RequireJSをインポートし、自分のアプリケーションに私のテンプレートをコンパイルするために、私は tpl!プラグインを使用しています

からtext!プラグインに似て:このすべてが素晴らしい作品下線テンプレート化 - (RequireJS付き)パーシャル

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定義の依存関係として定義したテンプレートが、テンプレートの変数スコープ(グローバル)で使用可能だった場合、コンパイル済みの部分をテンプレートに渡す必要はないでしょうか?私はここで完全に別の惑星にあるかもしれない

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

第二に、RequireJSではなく、テンプレートで使用するために利用されている依存関係定義の同じ種類を持っていることは本当にいいだろう。私がいれば、テンプレートの使い方を親切に説明してください。おそらく私はテンプレートエンジンを切り替える必要がありますか?

答えて

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 }); %> 
    <% 
}); %> 
+0

テンプレートにJavaScriptを追加するには、ビューの目的に反し。代わりにCanJSのようにこれを行うことができるフレームワークを使用してください:http://canjs.us/#can_view-render – TruMan1

関連する問題