我想使用 jQuery模板。乍一看,{{tmpl}} 标签似乎是要走的路,但我需要在模板时做一个额外的步骤,我不知道该怎么做。
有一个与数据对象的属性相关的数据类型定义。在下面的示例中,“电影”是一个文本字段,“发布”是一个数字字段。所有文本字段都使用特定模板,所有数字字段也是如此。那些嵌套模板对它们使用的上下文(这里是电影)一无所知。所以在那里使用的标签总是 ${value} 。相反,“外部”模板知道电影应该是什么样子。它的标签(电影和已发行)被“内部”数据类型相关的模板所取代。额外的步骤是在外部模板完成之前替换 ${value}。
我能想到的是:
//the template used for all string-fields
var templForStrings = "<b>${value}</b>";
//the template used for all numeric fields
var templForNum = "<i>${value}</i>";
//data of a movie
var data = {};
data.movie = "Cowboys and Aliens"; //a string field
data.released = 2011; //a numeric field
//the template to show a movie
var templForMovies = "<div>{{html movie}} ({{html released}})</div>";
//normally a loop over the fields here
var field = {value: data.movie};
data.movie = $.tmpl(templForStrings, field).fullhtml();
field.value = data.released;
data.released = $.tmpl(templForNum, field).fullhtml();
//now the movie template
$.tmpl(templForMovies, data).appendTo("body");
当然这个场景被简化了。数据类型模板比这复杂得多。数据可以是任何东西。由于 ${value} 在这里意味着两个不同的东西,我看不到如何使用插件提供的嵌套模板。但我很确定有一种比我的代码更优雅、更快的方法(甚至需要fullhtml-Plugin。拥有这样的模板真的很棒
<div>${movie} (${released})</div>
因为这些也可以由最终用户创建,并且应该尽可能简单。