Question

_.template([string=''], [options={}])

View in source See the npm package

创建一个预编译模板方法，可以插入数据到模板中 "interpolate" 分隔符相应的位置。 HTML会在 "escape" 分隔符中转换为相应实体。 在 "evaluate" 分隔符中允许执行JavaScript代码。 在模板中可以自由访问变量。 如果设置了选项对象，则会优先覆盖 _.templateSettings 的值。

注意: 在开发过程中，构建_.template可以使用 sourceURLs， 便于调试。

了解更多预编译模板的信息查看 lodash的自定义构建文档。

了解更多 Chrome 沙箱扩展的信息查看 Chrome的扩展文档。

添加版本

0.1.0

参数

1. [string=''] (string): 模板字符串.
2. [options={}] (Object): 选项对象.
3. [options.escape=_.templateSettings.escape] (RegExp): "escape" 分隔符.
4. [options.evaluate=_.templateSettings.evaluate] (RegExp): "evaluate" 分隔符.
5. [options.imports=_.templateSettings.imports] (Object): 导入对象到模板中作为自由变量。
6. [options.interpolate=_.templateSettings.interpolate] (RegExp): "interpolate" 分隔符。
7. [options.sourceURL='lodash.templateSources[n]'] (string): 模板编译的来源URL。
8. [options.variable='obj'] (string): 数据对象的变量名。

返回

(Function): 返回编译模板函数。

例子

// 使用 "interpolate" 分隔符创建编译模板var compiled = _.template('hello <%= user %>!');compiled({ 'user': 'fred' });// => 'hello fred!' // 使用 HTML "escape" 转义数据的值var compiled = _.template('<b><%- value %></b>');compiled({ 'value': '<script>' });// => '<b>&lt;script&gt;</b>' // 使用 "evaluate" 分隔符执行 JavaScript 和 生成HTML代码var compiled = _.template('<% _.forEach(users, function(user) { %><li><%- user %></li><% }); %>');compiled({ 'users': ['fred', 'barney'] });// => '<li>fred</li><li>barney</li>' // 在 "evaluate" 分隔符中使用内部的 `print` 函数var compiled = _.template('<% print("hello " + user); %>!');compiled({ 'user': 'barney' });// => 'hello barney!' // 使用 ES 分隔符代替默认的 "interpolate" 分隔符var compiled = _.template('hello ${ user }!');compiled({ 'user': 'pebbles' });// => 'hello pebbles!' // 使用自定义的模板分隔符_.templateSettings.interpolate = /{{([\s\S]+?)}}/g;var compiled = _.template('hello {{ user }}!');compiled({ 'user': 'mustache' });// => 'hello mustache!' // 使用反斜杠符号作为纯文本处理var compiled = _.template('<%= "\\<%- value %\\>" %>');compiled({ 'value': 'ignored' });// => '<%- value %>' // 使用 `imports` 选项导入 `jq` 作为 `jQuery` 的别名var text = '<% jq.each(users, function(user) { %><li><%- user %></li><% }); %>';var compiled = _.template(text, { 'imports': { 'jq': jQuery } });compiled({ 'users': ['fred', 'barney'] });// => '<li>fred</li><li>barney</li>' // 使用 `sourceURL` 选项指定模板的来源URLvar compiled = _.template('hello <%= user %>!', { 'sourceURL': '/basic/greeting.jst' });compiled(data);// => 在开发工具的 Sources 选项卡 或 Resources 面板中找到 "greeting.jst" // 使用 `variable` 选项确保在编译模板中不声明变量var compiled = _.template('hi <%= data.user %>!', { 'variable': 'data' });compiled.source;// => function(data) {//   var __t, __p = '';//   __p += 'hi ' + ((__t = ( data.user )) == null ? '' : __t) + '!';//   return __p;// } // 使用 `source` 特性内联编译模板// 便以查看行号、错误信息、堆栈fs.writeFileSync(path.join(cwd, 'jst.js'), '\  var JST = {\    "main": ' + _.template(mainText).source + '\  };\');