在handlebars.js中使用默认值切换大小写 [英] Switch case with default in handlebars.js

问题描述

我想借助HandlebarsJs中的Register Helper函数实现具有default值的自定义switch case.

I want to implement a custom switch case with default value with the help of the Register Helper function in HandlebarsJs.

示例:

HTML:

<div>
    {{#switch value}} 
        {{#case 'a'}} A {{/case}} 
        {{#case 'b'}} B {{/case}} 
        {{#default 'C'}} {{/default}}
    {{/switch}}
</div>

JS: (注册助手"功能应类似于下面的伪代码)

JS:(The Register Helper function should work like the below pseudo code)

switch(val) {
  case 1:
     return 'A';
     break;
  case 2:
     return 'B';
     break;
  default:
     return 'C';
}

推荐答案

请仔细阅读以下示例，它将逐步指导您添加具有默认值的开关盒并打破HandlebarsJs.

Please go through the below examples, it will guide you step by step to add the switch case with default value and break in HandlebarsJs.

使用链接 http://tryhandlebarsjs.com/来测试代码. (给予{} 对于上下文)

Use the link http://tryhandlebarsjs.com/ to test the code. (Give {} for Context)

车把模板:

<div>

        {{#switch 'a'}} 
            {{#case 'a'}} A {{/case}} 
            {{#case 'b'}} B {{/case}} 
        {{/switch}}

</div>

注册助手功能:

Handlebars.registerHelper('switch', function(value, options) {
  this.switch_value = value;
  return options.fn(this);
});

Handlebars.registerHelper('case', function(value, options) {
  if (value == this.switch_value) {
    return options.fn(this);
  }
});

================================================ =========================

==========================================================================

车把模板:

<div>

        {{#switch 'a'}} 
            {{#case 'a'}} A {{/case}} 
            {{#case 'b'}} B {{/case}}
            {{#default '188'}} {{/default}}
        {{/switch}}

</div>

注册助手功能:

Handlebars.registerHelper('switch', function(value, options) {
  this.switch_value = value;
  return options.fn(this);
});

Handlebars.registerHelper('case', function(value, options) {
  if (value == this.switch_value) {
    return options.fn(this);
  }
});

Handlebars.registerHelper('default', function(value, options) {
    return true; ///We can add condition if needs
});

================================================ =========================

==========================================================================

车把模板:

<div>
        {{#switch 'a'}} 
            {{#case 'a'}} A {{/case}} 
            {{#case 'b'}} B {{/case}} 
            {{#default '188'}} {{/default}}
        {{/switch}}
</div>

注册助手功能:

Handlebars.registerHelper('switch', function(value, options) {
  this.switch_value = value;
  this.switch_break = false;
  return options.fn(this);
});

Handlebars.registerHelper('case', function(value, options) {
  if (value == this.switch_value) {
    this.switch_break = true;
    return options.fn(this);
  }
});

Handlebars.registerHelper('default', function(value, options) {
   if (this.switch_break == false) {
     return value;
   }
});

这篇关于在handlebars.js中使用默认值切换大小写的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！