如何使用条件语句在 Handlebars 中显示/隐藏 html 元素

Question

我的车把标签中有以下内容：

{{#editmode mode}}

    <div class="form-group login-input">
       <i class="fa fa-key overlay"></i>
       <input type="password" class="form-control text-input" name="password" placeholder="Password" value="{{password}}">
    </div>

    <div class="form-group login-input">
       <i class="fa fa-key overlay"></i>
       <input type="password" class="form-control text-input" name="password_confirmation" value="{{password}}">
     </div>

{{/editmode}}

并且我将以下内容注册为我的辅助函数：

Handlebars.registerHelper('editmode', function(mode){           
    return mode == 'edit' ? true : false;
});

传递给车把模板的对象如下所示：

{
   firstname: 'Test',
   lastname: 'Test lastname',
   mode: 'new
}

所以基本上，只要 'mode' 变量是 'new'，我想显示密码字段，否则隐藏它们，但现在它们总是隐藏的。有什么想法吗？

Answer 1

我明白了。这成功了：

Handlebars.registerHelper('editmode', function(mode, options){                      
     return mode == 'edit' ? '' : options.fn();
});

Answer 2

您可以使用 if 语句。

<div class="form-group login-input">
   <i class="fa fa-key overlay"></i>
   <input type="password" class="form-control text-input" name="password" placeholder="Password" value="{{password}}">
</div>

{{#if mode}}
<div class="form-group login-input">
   <i class="fa fa-key overlay"></i>
   <input type="password" class="form-control text-input" name="password_confirmation" value="{{password}}">
 </div>
{{/if}}

如何使用条件语句在 Handlebars 中显示/隐藏 html 元素

How to show / hide html elements in Handlebars using conditional statement

javascript

jquery

templates

handlebars.js