1 min read

HTMLBars 语法

HTMLBars 是 Ember.js 的新模板语言,基于 handlebars.js,但更为强大、直观。

属性可直接绑定

原先我们要给 HTML 标签绑定属性需要借助 bind-attr

<a {{bind-attr href=url}}>点我</a>

现在可以这样写:

<a href={{url}}>点我</a>

更加直观,明了。

变量可任意位置使用

借由上一步的功能,我们现在可以在模板的任意位置中使用变量:

<a href="http://www.zfanw.com/blog/{{name}}">陈三</a>

又比如:

<a style="color: {{linkColor}}">陈三</a>

if 可行内使用

if 判断语句可以在行内使用:

<a href="http://www.zfanw.com/blog/{{if name '陈三' '不认识'}}">陈三</a>

不必以下这种写法:

{{#if name}}
'陈三'
{{else}}
'不认识'
{{/if}}

参考

  1. HTMLBars: The Next-Generation of Templating in Ember.js
报告问题 修订

如果你有自建 https 代理的需求,欢迎尝试 Phantom,一键搭建,方便快捷。查看 demo