1

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

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

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

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

您认为我可以使用模板来实现这一点还是必须使用解决方法?

4

1 回答 1

2

您可以在模板中调用任何全局可访问的函数。所以,如果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
});

演示:

  1. 全球Globalizewindow.Globalize.
  2. 局部Globalize通过_.template参数。.

Underscore 模板真的没有什么特别之处,里面的东西<%= %>只是包裹在一个withblock中的 JavaScript 代码。您甚至可以通过查看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 转换。

于 2012-06-01T16:55:16.830 回答