Handlebars.js否则如果 [英] Handlebars.js Else If

问题描述

我使用Handlebars.js进行客户端视图呈现。如果Else很好，但是我遇到了一种需要ELSE IF的三种条件：

这不起作用：

  {{＃if FriendStatus.IsFriend}} 
< div class =ui-state-default ui-corner-all title =。ui-icon-mail-closed>< span class =ui-icon ui-icon-mail-closed>< / span>< / div> 
 {{else if FriendStatus.FriendRequested}} 
< div class =ui-state-default ui-corner-alltitle =。ui-icon-check>< span class =ui-icon ui-icon-check>< / span>< / div> 
 {{else}} 
 
 {{/ if}} 
  

如何使用句柄ELSE IF

解决方案

Handlebars自3.0.0起支持 {{else if}}

Handlebars v3.0.0或更高版本：

  {{＃if FriendStatus.IsFriend}} 
< div class =ui-state-default ui-corner-alltitle =。ui-icon-mail-closed>< span class =ui-icon ui-icon-mail-closed>< / span>< / div> 
 {{else if FriendStatus.FriendRequested}} 
< div class =ui-state-default ui-corner-alltitle =。ui-icon-check>< span class =ui-icon ui-icon-check>< / span>< / div> 
 {{else}} 
 
 {{/ if}} 
  

然而，在Handlebars v3.0.0之前，必须定义一个处理分支逻辑的帮助器，或者手动嵌套 if 语句：

  {{＃if FriendStatus.IsFriend}} 
< div class =ui-state-default ui-corner-alltitle =。ui-icon-mail -closed>< span class =ui-icon ui-icon-mail-closed>< / span>< / div> 
 {{else}} 
 {{#if FriendStatus.FriendRequested}} 
< div class =ui-state-default ui-corner-alltitle =。ui-icon -check>< span class =ui-icon ui-icon-check>< / span>< / div> 
 {{else}} 
 
 {{/ if}} 
 {{/ if}} 
  

I'm using Handlebars.js for client side view rendering. If Else works great but I've encountered a 3 way conditional that requires ELSE IF:

This doesn't work:

{{#if FriendStatus.IsFriend }}
    <div class="ui-state-default ui-corner-all" title=".ui-icon-mail-closed"><span class="ui-icon ui-icon-mail-closed"></span></div>
{{else if FriendStatus.FriendRequested}}
    <div class="ui-state-default ui-corner-all" title=".ui-icon-check"><span class="ui-icon ui-icon-check"></span></div>
{{else}}
    <div class="ui-state-default ui-corner-all" title=".ui-icon-plusthick"><span class="ui-icon ui-icon-plusthick"></span></div>
{{/if}}

How do I do ELSE IF with handlebars?

解决方案

Handlebars supports {{else if}} blocks as of 3.0.0.

Handlebars v3.0.0 or greater:

{{#if FriendStatus.IsFriend}}
  <div class="ui-state-default ui-corner-all" title=".ui-icon-mail-closed"><span class="ui-icon ui-icon-mail-closed"></span></div>
{{else if FriendStatus.FriendRequested}}
  <div class="ui-state-default ui-corner-all" title=".ui-icon-check"><span class="ui-icon ui-icon-check"></span></div>
{{else}}
  <div class="ui-state-default ui-corner-all" title=".ui-icon-plusthick"><span class="ui-icon ui-icon-plusthick"></span></div>
{{/if}}

Prior to Handlebars v3.0.0, however, you will have to either define a helper that handles the branching logic or nest if statements manually:

{{#if FriendStatus.IsFriend}}
  <div class="ui-state-default ui-corner-all" title=".ui-icon-mail-closed"><span class="ui-icon ui-icon-mail-closed"></span></div>
{{else}}
  {{#if FriendStatus.FriendRequested}}
    <div class="ui-state-default ui-corner-all" title=".ui-icon-check"><span class="ui-icon ui-icon-check"></span></div>
  {{else}}
    <div class="ui-state-default ui-corner-all" title=".ui-icon-plusthick"><span class="ui-icon ui-icon-plusthick"></span></div>
  {{/if}}
{{/if}}

这篇关于Handlebars.js否则如果的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！