Logischer Operator in einer Handlebars.js {{#if}} Bedingung

Question

Gibt es eine Möglichkeit, in Handlebars JS logische Operatoren in den Standard-Handlebars.js-Bedingungsoperator einzubinden? Etwas wie das:

{{#if section1 || section2}}
.. Inhalt
{{/if}}

Ich weiß, ich könnte meinen eigenen Helfer schreiben, aber ich möchte zuerst sicherstellen, dass ich nicht das Rad neu erfinde.

Answer 1

Ein Problem bei allen hier geposteten Antworten ist, dass sie nicht mit gebundenen Eigenschaften funktionieren, d.h. die Bedingung wird nicht neu ausgewertet, wenn sich die beteiligten Eigenschaften ändern. Hier ist eine etwas fortgeschrittenere Version des Helpers, die Bindungen unterstützt. Sie verwendet die bind Funktion aus der Ember-Quelle, die auch verwendet wird, um den normalen Ember #if Helper zu implementieren.

Dieser ist auf eine einzelne gebundene Eigenschaft auf der linken Seite beschränkt, die mit einem Konstanten auf der rechten Seite verglichen wird, was meiner Meinung nach für die meisten praktischen Zwecke ausreicht. Wenn Sie etwas Fortgeschritteneres als einen einfachen Vergleich benötigen, dann wäre es vielleicht gut, damit zu beginnen, einige berechnete Eigenschaften zu deklarieren und stattdessen den normalen #if Helper zu verwenden.

Ember.Handlebars.registerHelper('ifeq', function(a, b, options) {
  return Ember.Handlebars.bind.call(options.contexts[0], a, options, true, function(result) {
    return result === b;
  });
});

Sie können es so verwenden:

{{#ifeq obj.some.property "something"}}
  Sie sind gleich!
{{/ifeq}}

Answer 2

Hier ist eine Lösung, wenn Sie mehrere Bedingungen überprüfen möchten:

/* Handler zum Überprüfen mehrerer Bedingungen
   */
  Handlebars.registerHelper('checkIf', function (v1,o1,v2,mainOperator,v3,o2,v4,options) {
      var operators = {
           '==': function(a, b){ return a==b},
           '===': function(a, b){ return a===b},
           '!=': function(a, b){ return a!=b},
           '!==': function(a, b){ return a!==b},
           '<': function(a, b){ return a': function(a, b){ return a>b},
           '>=': function(a, b){ return a>=b},
           '&&': function(a, b){ return a&&b},
           '||': function(a, b){ return a||b},
        }
      var a1 = operators[o1](v1,v2);
      var a2 = operators[o2](v3,v4);
      var isTrue = operators[mainOperator](a1, a2);
      return isTrue ? options.fn(this) : options.inverse(this);
  });

Verwendung:

/* if(list.length>0 && public){}*/

{{#checkIf list.length '>' 0 '&&' public '==' true}} Bedingung erfüllt{{/checkIf}}

Answer 3

Verbesserte Lösung, die grundsätzlich mit jedem binären Operator funktioniert (zumindest Zahlen, Strings funktionieren nicht gut mit eval, VORSICHT BEI MÖGLICHER SKRIPTINJEKTION BEI VERWENDUNG EINES NICHT DEFINIERTEN OPERATORS MIT BENUTZEREINGABEN):

Handlebars.registerHelper("ifCond",function(v1,operator,v2,options) {
    switch (operator)
    {
        case "==":
            return (v1==v2)?options.fn(this):options.inverse(this);

        case "!=":
            return (v1!=v2)?options.fn(this):options.inverse(this);

        case "===":
            return (v1===v2)?options.fn(this):options.inverse(this);

        case "!==":
            return (v1!==v2)?options.fn(this):options.inverse(this);

        case "&&":
            return (v1&&v2)?options.fn(this):options.inverse(this);

        case "||":
            return (v1||v2)?options.fn(this):options.inverse(this);

        case "<":
            return (v1":
            return (v1>v2)?options.fn(this):options.inverse(this);

        case ">=":
         return (v1>=v2)?options.fn(this):options.inverse(this);

        default:
            return eval(""+v1+operator+v2)?options.fn(this):options.inverse(this);
    }
});

Answer 4

Hier ist ein Link zum Block-Helper, den ich benutze: Vergleichsblock-Helper. Er unterstützt alle Standardoperatoren und ermöglicht es Ihnen, Code wie unten gezeigt zu schreiben. Es ist wirklich ziemlich praktisch.

{{#compare Database.Tables.Count ">" 5}}
Es gibt mehr als 5 Tabellen
{{/compare}}

Answer 5

Install Ember Truth Helpers Add-On, indem du den folgenden Befehl ausführst

ember install ember-truth-helpers

Du kannst die meisten logischen Operatoren (eq, not-eq, not, and, or, gt, gte, lt, lte, xor) verwenden.

{{#if (or section1 section2)}}  
...Inhalt  
{{/if}}

Du kannst sogar Unterausdrücke verwenden, um weiterzugehen,

{{#if (or (eq section1 "section1") (eq section2 "section2")) }}  
...Inhalt  
{{/if}}