在 Ember Handlebar If block helper 中检查值是不是等于

Posted 2023-02-19

【中文标题】在 Ember Handlebar If block helper 中检查值是不是等于

【英文标题】：Check for a value equals to in Ember Handlebar If block helper在 Ember Handlebar If block helper 中检查值是否等于

【发布时间】：2012-06-25 13:02:22

【问题描述】：

我们如何检查 ember.js 的 If-block 助手中的值相等？

#if person=="John"

我们如何在车把上执行上述操作？

【问题讨论】：

Logical operator in a handlebars.js #if conditional也有这个问题的答案

【参考方案1】：

如果您使用的是 htmlBars（Ember 版本 1.10+），那么您可以使用 Ember Truth Helper 插件：

https://github.com/jmurphyau/ember-truth-helpers

安装后，就这么简单：

#if (eq person "John") hello /if

【讨论】：

可以不用ember-cli吗？

@AbbasovAlexander：我没有在没有 Ember CLI 的情况下尝试过，但我不明白为什么不这样做。

这不在原版车把中。

@doublejosh 您需要安装真相助手插件。 :-)

【参考方案2】：

虽然这个问题可以通过编写使用 eq 助手来解决

#if (eq person "John") hello /if

但是对于一个通用的解决方案，您可以制作自己的助手，它将三个参数 param[0] 和 param[2] 作为操作数和 param[1] 作为运算符。下面是帮助文件。

比较.js

import Ember from 'ember';

export function compare(params) 
  if(params[3])  //handle case insensitive conditions if 4 param is passed.
    params[0]= params[0].toLowerCase();
    params[2]= params[2].toLowerCase();
  
  let v1 = params[0];
  let operator = params[1];
  let v2 = params[2];
  switch (operator) 
    case '==':
      return (v1 == v2);
    case '!=':
      return (v1 != v2);
    case '===':
      return (v1 === v2);
    case '<':
      return (v1 < v2);
    case '<=':
      return (v1 <= v2);
    case '>':
      return (v1 > v2);
    case '>=':
      return (v1 >= v2);
    case '&&':
      return !!(v1 && v2);
    case '||':
      return !!(v1 || v2);
    default:
      return false;
  


export default Ember.Helper.helper(compare);

现在您可以轻松地将其用于多种用途。

用于相等性检查。

#if (compare person '===' 'John') /if

为了更好的检查。

#if (compare money '>' 300) /if

等等。

【参考方案3】：

使用Ember.Component，从而避免在您的类中重复定义计算属性（如上面的personIsJohn）：

// if_equal_component.js script
App.IfEqualComponent = Ember.Component.extend(
  isEqual: function() 
    return this.get('param1') === this.get('param2');
  .property('param1', 'param2')
);

// if-equal.handlebars template
#if isEqual
  yield
/if

您可以使用App.ElseEqualComponent 定义比较的else 部分：

// else_equal_component.js script
App.ElseEqualComponent = App.IfEqualComponent.extend();

// else-equal.handlebars template
#unless isEqual
  yield
/unless

用法：

#if-equal param1=person param2="John"
  Hi John!
/if-equal
#else-equal param1=person param2="John"
  Who are you?
/else-equal

【参考方案4】：

扩展 Jo Liss 的答案，您现在可以使用计算属性宏来执行此操作，以获得更简洁和可读的代码。

personIsJohn: function() 
  return this.get('person') === 'John';
.property('person')

变成

personIsJohn: Ember.computed.equal('person', 'John')

Relavent Docs。

【参考方案5】：

#if 助手只能测试属性，不能测试任意表达式。因此，在这种情况下，最好的办法是编写一个属性来计算您想要测试的任何条件。

personIsJohn: function() 
  return this.get('person') === 'John';
.property('person')

然后#if personIsJohn。

注意：如果你觉得这太局限了，你也可以register your own more powerful if helper。

【讨论】：

@JoLiss 你可以将任意表达式从模板传递到计算属性吗？

不，计算属性不能接受参数。因此，您需要为要测试的每个值创建一个单独的 CP：personIsJohn、personIsMike、... >

不错的答案。他们真的需要把它放在车把上。

感谢@JoLiss - 这正是我今天所需要的，以过滤除众多组织之外的所有组织。

嗨乔，我正在尝试类似的东西，但没有成功。sectionfeedIsEqual: (function() debugger return this.get('param1') === this.get('param2 '); .property('param1', 'param2') ) 但我没有在 param1 和 param2 中得到值