Question

我正在使用下划线模板来创建HTML列表，此列表包含我想要全球化的日期字段。模板的简化如下所示：

<li>Date: <%= date %> </li>

这个日期是一个Javascript日期对象，所以不想直接打印这个值，我想用globalize打印它。如果没有模板，解决方案应如下所示：

var html = "<li>Date: " + Globalize.format(settings.get('lastUpdate'),'F') + "</li>";

您认为我可以使用模板来实现此目标，还是必须使用解决方法？

Answer 1

您可以在模板中调用任何全局可访问的函数。因此，如果Globalize是全局的（即window的属性），那么此模板：

<script id="tmpl" type="text/html">
    <li>Date: <%= Globalize.format(date, 'F') %></li>
</script>

将使用此JavaScript：

_.template($('#tmpl').html(), {
    date: some_date_that_globalize_understands
});

如果您没有Globalize全球可用，那么您可以：

window.Globalize = Globalize;

使其全局可用或只是手动将其添加到模板的命名空间：

_.template($('#tmpl').html(), {
    Globalize: Globalize,
    date:      some_date_that_globalize_understands
});

演示：

Global Globalize through window.Globalize.。
Local Globalize through the _.template parameters.。

Underscore模板真的没有什么特别之处，<%= %>中的内容只是JavaScript代码，最终包含在with block中。您甚至可以通过查看返回的模板函数上的source属性来查看函数的源代码：

var t = _.template($('#t').html());
console.log(t.source);

你会看到一些相当简单（如果丑陋）的JavaScript：

function(obj){
var __p='';var print=function(){__p+=Array.prototype.join.call(arguments, '')};
with(obj||{}){
__p+='\n    '+
( Globalize.mangle(pancakes) )+
'\n';
}
return __p;
}

+ (Globalize.mangle(pancakes) )+位是<%= Globalize.mangle(pancakes) %>变成的位置。没有魔法，没有<%= ... %>内容的特殊解析，只是一个简单（但有效）的JavaScript转换。

将jQuery Globalize与underscore.js模板结合起来？

1 个答案: