テンプレート内から JavaScript 関数にアクセスできます。したがって、何かを入れることができますwindow
(つまり、グローバルスコープ):
window.underscore_helpers = {
list_of_booleans: function(obj, bools) {
// 'obj' is the object for the template, 'bools'
// is an array of field names. Loop through 'bools'
// and build your HTML...
return the_html_li_elements;
}
};
次に、次のvariable
オプションを_.template
利用する必要があります。
デフォルトでは、テンプレートwith
はデータの値をステートメントを介してローカル スコープに配置します。ただし、 variable設定で単一の変数名を指定できます。これにより、テンプレートのレンダリング速度が大幅に向上します。
_.template("<%= data.hasWith %>", {hasWith: 'no'}, {variable: 'data'});
=> "no"
次に、テンプレートに次のようなものを含めることができます。
<%= underscore_helpers.list_of_booleans(
json,
['a_c', 'mp3', 'gps', 'touchscreen']
) %>
テンプレートを次のように使用します。
var html = _.template($('#t').html(), model.toJSON(), { variable: 'json' });
// or
var tmpl = _.template($('#t').html(), null, { variable: 'json' });
var html = tmpl(model.toJSON());
デモ: http://jsfiddle.net/ambiguous/Yr4m5/
オプションを使用すると、代わりにvariable
言う必要がありますが、それはかなりマイナーです。<%= json.attribute %>
<%= attribute %>
同様のアプローチを使用して、 を<li>
1 つずつフォーマットし、より多くの HTML をテンプレートに保持できます。
もう 1 つのオプションはfor
、次のようなループをテンプレートにスローすることです。
<script id="t" type="text/x-underscore-template">
<ul>
<% var fields = ['a_c', 'mp3', 'gps', 'touchscreen' ] %>
<% for(var i = 0; i < fields.length; ++i) { %>
<li class="<%= json[fields[i]] ? 'true' : 'false' %>"><%= fields[i] %></li>
<% } %>
</ul>
</script>
デモ: http://jsfiddle.net/ambiguous/983ks/
variable: 'json'
これもオプションを使用していることに気付くでしょう[]
。名前が変数にある場合に、名前でフィールドを取得するために on を使用するために必要です。このアル