Underscore 模板引擎 API 更新 about blog HOT 9 OPEN

汗，1.4 都用了好久了，还真没注意到有这个更新，这么个设置还是挺有用的
主要是项目里全换成 handlebars 了，underscore 的模板还是有点弱啊

from blog.

@edokeh
我的都是小项目，本来就依赖 Underscore，模板引擎也直接用它的了。简单够用，更复杂的估计我也不会用，呵呵。
不过等等，Underscore 的模板支持完整的 JS 逻辑，开放、灵活，可以说它简单，但并不“弱”吧？

from blog.

嘿嘿，我们也是小项目啊，只是碰到些奇怪的需求嘛
主要遇到的问题是，underscore 缺少一个 helper 层，导致某些功能实现起来很别扭
我们的前端模板里面某些文字要做 i18n ，用 underscore 的话就只能污染数据对象来实现了

比如模板是这样

<div>
  <h1><%= i18n('title') %>:<%= name %></h1>
</div>

那么就得这么弄

var data = {name:'edokeh'};

_.extend(data, {
  i18n: function(key) {
    return I18N_DATA[key]
  }
})

_.template('...', data);

这时候 data 对象就被污染了，可能会有些潜在问题，而且从逻辑上来说也很不好啊

from blog.

@edokeh
Helper 层完全可以自己写，我感觉反而更灵活（借口，实际上模板规则太多了我记不住啊，哈哈）。Underscore 模板内部可以调用任何全局作用域可以调用的函数和变量，因为模板内的所有逻辑代码就是原生的 JavaScript 代码。

比如你的例子，其实不需要扩展数据源，直接这样写模板就可以：

<div>
  <h1><%= I18N_DATA['title'] %>:<%= name %></h1>
</div>

如果一定解除模板对全局变量的依赖，并且不想改写数据源，也可以为模板单独准备数据：

var data = {name: 'edokeh'};
var dataToRender = _.extend({}, data, {
  title: I18N_DATA['title']
});

然后使用这个模板：

<div>
  <h1><%= title %>:<%= name %></h1>
</div>

当然这样稍显琐碎，还是前一种方法更直观。我感觉模板里存在适度逻辑（或对全局变量的适度调用）还是 OK 的。

from blog.

我们用 SeaJS 封装的模块，没有全局变量。。。
那个扩展的方式其实我们之前采用过的，可是写起来真的好麻烦。。。索性整体换个模板系统好了
其实 handlebars 用起来也不是很爽，里面完全不能放逻辑，不过幸好我们的系统没那么复杂，基本都能应对
赞同你说的适度逻辑的观点，handlebars 的世界观有些过于激进了

from blog.

@edokeh 是这样啊，明白了。
p.s. 不过 Sea.js 模块应该也可以手工暴露全局变量的，嘿嘿。

from blog.

是否有哪个线上应用用到了这个！

from blog.

@godpeacy 不好意思现在才看到你的留言。

我自己的经验是这样的：

• CMUI 内部是用到了 Underscore 的模板引擎的。
• 优e网 - 手机版 的前端模板引擎也是它。

更新：

• 百姓网 - 手机版 用它来作为轻量的前端模板解决方案。

from blog.

underscore is a greate template engine for html render.

from blog.