Lodash _.template

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

創(chuàng)建一個預編譯模板方法，可以插入數(shù)據(jù)到模板中 "interpolate" 分隔符相應的位置。 HTML會在 "escape" 分隔符中轉換為相應實體。 在 "evaluate" 分隔符中允許執(zhí)行JavaScript代碼。 在模板中可以自由訪問變量。 如果設置了選項對象，則會優(yōu)先覆蓋?_.templateSettings ?的值。注意: 在開發(fā)過程中，構建_.template可以使用sourceURLs， 便于調試。了解更多預編譯模板的信息查看lodash的自定義構建文檔。了解更多 Chrome 沙箱擴展的信息查看Chrome的擴展文檔。

添加版本

0.1.0

參數(shù)

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): 數(shù)據(jù)對象的變量名。

返回

(Function): 返回編譯模板函數(shù)。

例子

// 使用 "interpolate" 分隔符創(chuàng)建編譯模板var compiled = _.template('hello <%= user %>!');
compiled({ 'user': 'fred' });
// => 'hello fred!' 
// 使用 HTML "escape" 轉義數(shù)據(jù)的值
var compiled = _.template('<b><%- value %></b>');
compiled({ 'value': '<script>' });
// => '<b><script></b>' 
// 使用 "evaluate" 分隔符執(zhí)行 JavaScript 和 生成HTML代碼
var compiled = _.template('<% _.forEach(users, function(user) { %><li><%- user %></li><% }); %>');
compiled({ 'users': ['fred', 'barney'] });
// => '<li>fred</li><li>barney</li>' 
// 在 "evaluate" 分隔符中使用內(nèi)部的 `print` 函數(shù)
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` 選項指定模板的來源URL
var compiled = _.template('hello <%= user %>!', { 'sourceURL': '/basic/greeting.jst' });
compiled(data);
// => 在開發(fā)工具的 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` 特性內(nèi)聯(lián)編譯模板
// 便以查看行號、錯誤信息、堆棧
fs.writeFileSync(path.join(cwd, 'jst.js'), '\ 
 var JST = {
\    "main": ' + _.template(mainText).source + '\  };
\');