我已经开始使用Handlebars.js。似乎没有像其他内置的条件。 我希望有这样的东西
{{#if type.one }}
do something ... IF
{{else if type.two}}
do something ... ELSE IF
{{else}}
do something ... ELSE
{{/if}}
但这不起作用。如何使用把手进行ELSE IF?写自定义助手是唯一的选择吗?如果是,那么请提供一些指导来编写这个帮助。
答案 0 :(得分:21)
你不能使用自定义帮助器作为Handlebars if-ish helper只能理解两个部分:“if”部分和“else”部分。你可以嵌套东西:
{{#if type.one}}
do something ... IF
{{else}}
{{#if type.two}}
do something ... ELSE IF
{{else}}
{{#if type.three}}
...
{{else}}
...
{{/if}}
{{/if}}
{{/if}}
这种事情会变得很快,所以你可能不想这样做。一个更好的方法(像往常一样使用Handlebars)将逻辑推送到JavaScript中,以便最多type.one
,type.two
,type.three
,...中的一个是真的;那么你可以:
{{#if type.one}}
...
{{/if}}
{{#if type.two}}
...
{{/if}}
{{#if type.three}}
...
{{/if}}
如果type
有很多选项,或者{{#if}}
中的实体很复杂,您可以切换到局部。您必须添加一个自定义帮助程序来构建基于模板变量的部分名称;像这样的东西:
Handlebars.registerHelper('show_type', function(type) {
var types = ['one', 'two', 'three'];
var partial;
for(var i = 0; i < types.length; ++i) {
if(!type[types[i]])
continue;
partial = '_partial_' + types[i];
break;
}
if(partial)
return Handlebars.partials[name](this);
else
return '';
});
然后,假设您的部分已全部注册且一致命名,您可以说:
{{show_type type}}
答案 1 :(得分:10)
自从Handlebars 3.0以来,OP所描述的语法确实可以开箱即用!有关详细信息,请参阅:https://github.com/wycats/handlebars.js/pull/892。
注意: 对于Ember,从版本1.10开始,这也有效。也可以看看: http://emberjs.com/blog/2015/02/07/ember-1-10-0-released.html#toc_chained-else-blocks
答案 2 :(得分:4)
如果您使用类似ember的框架,
{{#if isAtWork}}
Ship that code!
{{else if isReading}}
You can finish War and Peace eventually...
{{/if}}
link:http://guides.emberjs.com/v1.12.0/templates/conditionals/
答案 3 :(得分:1)
你可以这样做:
{{#if type.one}}
...
{{else}} {{#if type.two}}
...
{{else}} {{#if type.three}}
...
{{else}}
...
{{/if}}{{/if}}{{/if}}
答案 4 :(得分:1)
如果您想要切换行为,可能会对Dan Harper's helpers感兴趣,您可以执行以下操作:
{{#is type 1}}
<p>Do something when 1.</p>
{{else}}{{#is type 2}}
<p>Do something when 2.</p>
{{else}}{{#is type 3}}
<p>Do something when 3.</p>
{{/is}}{{/is}}{{/is}}
这是jsfiddle。
答案 5 :(得分:0)
OP编写的确切语法今天将在Ember Canary中使用
ember-htmlbars-inline-if-helper
已启用功能标记。