Logischer Operator in einem lastlebars.js {{#if}} -Konditional

Wobei die Lösung einen Schritt weiter. Dies fügt die compare-operator.

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 > 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);
        default:
            return options.inverse(this);
    }
});

Verwenden Sie es in ein template wie dieses:

{{#ifCond var1 '==' var2}}

Kaffee-Script-version

Handlebars.registerHelper 'ifCond', (v1, operator, v2, options) ->
    switch operator
        when '==', '===', 'is'
            return if v1 is v2 then options.fn this else options.inverse this
        when '!=', '!=='
            return if v1 != v2 then options.fn this else options.inverse this
        when '<'
            return if v1 < v2 then options.fn this else options.inverse this
        when '<='
            return if v1 <= v2 then options.fn this else options.inverse this
        when '>'
            return if v1 > v2 then options.fn this else options.inverse this
        when '>='
            return if v1 >= v2 then options.fn this else options.inverse this
        when '&&', 'and'
            return if v1 and v2 then options.fn this else options.inverse this
        when '||', 'or'
            return if v1 or v2 then options.fn this else options.inverse this
        else
            return options.inverse this

InformationsquelleAutor der Antwort

Gibt es eine einfache Möglichkeit dies zu tun, ohne zu schreiben eine helper-Funktion... Es kann getan werden, in der Vorlage vollständig.

{{#if cond1}}   
  {{#if con2}}   
    <div> and condition completed</div>  
  {{/if}}
{{else}}   
  <div> both conditions weren't true</div>  
{{/if}}

Edit: Umgekehrt können Sie tun, oder ist dies zu tun:

{{#if cond1}}  
  <div> or condition completed</div>    
{{else}}   
  {{#if cond2}}  
    <div> or condition completed</div>  
  {{else}}      
    <div> neither of the conditions were true</div>    
  {{/if}}  
{{/if}}

Bearbeiten/Hinweis: die LENKER der website: handlebarsjs.com hier sind die falsy-Werte:

Können Sie verwenden, wenn Helfer bedingt machen einen block. Wenn seine
argument liefert false, undefined, null, "" oder [] (ein "falsy-Wert"),
Dann alle 'cond' (wie cond1 oder cond2) wird nicht gezählt, wie wahr.

InformationsquelleAutor der Antwort jQwierdy

Verbesserte Lösung, die im Grunde die Arbeit mit jedem binären operator (mindestens zahlen, strings funktioniert nicht gut mit eval, KÜMMERN sich um MÖGLICHE SCRIPT-INJECTION bei VERWENDUNG EINES NICHT DEFINIERTEN-BETREIBER MIT USER-INPUT):

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<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);

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

InformationsquelleAutor der Antwort Vincent

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

/* Handler to check multiple conditions
   */
  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<b},
           '<=': 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||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}} <p>condition satisfied</p>{{/checkIf}}

InformationsquelleAutor der Antwort Sateesh Kumar Alli

Eine andere alternative ist die Verwendung der Funktion Namen in #if. Die #if wird erkannt, wenn der parameter Funktion, und wenn es ist, dann wird Sie es nennen, und verwenden Sie seine Rückkehr für truthyness überprüfen. Unten myFunction wird aktuellen Kontext als this.

{{#if myFunction}}
  I'm Happy!
{{/if}}

InformationsquelleAutor der Antwort ShitalShah

Kann ich verstehen, warum Sie möchten, um zu erstellen ein Helfer für die Situationen, in denen Sie eine große Anzahl von vielfältigen vergleichen innerhalb Ihrer Vorlage, aber für eine relativ geringe Anzahl der Vergleiche (oder sogar ein, das war es, was brachte mich zu dieser Seite in den ersten Platz), es würde wahrscheinlich einfacher sein, zu definieren, einen neuen LENKER variable im view-rendering-Funktion aufrufen, wie:

Pass-LENKER auf render:

var context= {
    'section1' : section1,
    'section2' : section2,
    'section1or2' : (section1)||(section2)
};

und dann in den LENKER Vorlage:

{{#if section1or2}}
    .. content
{{/if}}

Ich erwähne dies, der Einfachheit halber, und auch weil es eine Antwort, die kann schnell und hilfreich, während immer noch die Einhaltung der logicless Natur der LENKER.

InformationsquelleAutor der Antwort Programmer Dan

wenn Sie nur wollen, um zu überprüfen, ob der ein oder andere element vorhanden sind, können Sie diese benutzerdefinierte Helfer

Handlebars.registerHelper('if_or', function(elem1, elem2, options) {
  if (Handlebars.Utils.isEmpty(elem1) && Handlebars.Utils.isEmpty(elem2)) {
    return options.inverse(this);
  } else {
    return options.fn(this);
  }
});

wie diese

{{#if_or elem1 elem2}}
  {{elem1}} or {{elem2}} are present
{{else}}
  not present
{{/if_or}}

wenn Sie müssen auch in der Lage sein, um eine "oder" zu vergleichen
Funktion Werte zurückgeben
Eher würde ich hinzufügen, eine weitere Eigenschaft, gibt das gewünschte Ergebnis.

Die Vorlagen werden sollte logicless, nachdem alle!

InformationsquelleAutor der Antwort deepflame

Für diejenigen, die das zu Problemen beim Vergleich von Objekteigenschaften, innerhalb der Helfer fügen Sie diese Lösung

Ember.js Helfer nicht richtig erkennen, ein parameter

InformationsquelleAutor der Antwort Manuel Cepeda

Hier haben wir die vanilla-LENKER für mehrere logische && und || (oder):

Handlebars.registerHelper("and",function() {
    var args = Array.prototype.slice.call(arguments);
    var options = args[args.length-1];

    for(var i=0; i<args.length-1; i++){
        if( !args[i] ){
            return options.inverse(this);
        }
    }

    return options.fn(this);
});


Handlebars.registerHelper("or",function() {
    var args = Array.prototype.slice.call(arguments);
    var options = args[args.length-1];

    for(var i=0; i<args.length-1; i++){
        if( args[i] ){
            return options.fn(this);
        }
    }

    return options.inverse(this);
}

//Results
//{{#and foo bar sally bob}} yup {{else}} nope {{/and}} //yup
//{{#or foo bar "" sally bob}} yup {{else}} nope {{/or}} //yup

//{{#and foo bar "" sally bob}} yup {{else}} nope {{/and}} //nope
//{{#or "" "" "" "" ""}} yup {{else}} nope {{/or}} //nope

Nicht so sicher, ob es "sicher" zu verwenden, "und" und "oder"... vielleicht ändern, um so etwas wie "op_and" und "op_or"?

InformationsquelleAutor der Antwort bob

In Ember.js Sie können inline wenn Helfer im if-block Helfer. Es kann ersetzen Sie || logischer operator, zum Beispiel:

{{#if (if firstCondition firstCondition secondCondition)}}
  (firstCondition || (or) secondCondition) === true
{{/if}}

InformationsquelleAutor der Antwort Daniel Kmak

Richtige Lösung für UND/ODER

Handlebars.registerHelper('and', function () {
    //Get function args and remove last one (function name)
    return Array.prototype.slice.call(arguments, 0, arguments.length - 1).every(Boolean);
});
Handlebars.registerHelper('or', function () {
    //Get function args and remove last one (function name)
    return Array.prototype.slice.call(arguments, 0, arguments.length - 1).some(Boolean);
}); 

Dann rufen Sie wie folgt

{{#if (or (eq questionType 'STARTTIME') (eq questionType 'ENDTIME') (..) ) }}

BTW: Beachten Sie, dass die Lösung, die hier gegeben ist falsch, er ist nicht subtrahieren Sie die Letzte argument ist der name der Funktion.
https://stackoverflow.com/a/31632215/1005607

Seiner ursprünglichen UND/ODER basierend auf der vollständigen Liste der Argumente

   and: function () {
        return Array.prototype.slice.call(arguments).every(Boolean);
    },
    or: function () {
        return Array.prototype.slice.call(arguments).some(Boolean);
    }

Kann das jemand ändern, dass diese Antwort? Ich habe gerade eine Stunde damit verschwendet, etwas zu reparieren, in einer Antwort empfohlen von 86 Menschen. Der fix ist filter aus dem letzten argument, das ist der name der Funktion. Array.prototype.slice.call(arguments, 0, arguments.length - 1)

InformationsquelleAutor der Antwort gene b.

Hier ist ein Ansatz, ich bin für ember 1.10 und ember-cli 2.0.

//app/helpers/js-x.js
export default Ember.HTMLBars.makeBoundHelper(function (params) {
  var paramNames = params.slice(1).map(function(val, idx) { return "p" + idx; });
  var func = Function.apply(this, paramNames.concat("return " + params[0] + ";"))
  return func.apply(params[1] === undefined ? this : params[1], params.slice(1));
});

Dann können Sie es in Ihre Vorlagen wie diese:

//used as sub-expression
{{#each item in model}}
  {{#if (js-x "this.section1 || this.section2" item)}}
  {{/if}}
{{/each}}

//used normally
{{js-x "p0 || p1" model.name model.offer.name}}

Wo die Argumente, die dem Ausdruck übergeben werden, wie p0,p1,p2 etc und p0 können auch referenziert werden, als this.

InformationsquelleAutor der Antwort Michael