Domanda

C'è un modo nel manubrio JS per incorporare gli operatori logici nell'operatore condizionale manubrio.js standard? Qualcosa come questo:

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

So che potrei scrivere il mio aiutante, ma prima mi piacerebbe assicurarmi di non reinventare la ruota.

È stato utile?

Soluzione

Ciò è possibile "imbrogliare" con un aiutante a blocchi. Questo probabilmente va contro l'ideologia delle persone che hanno sviluppato manubrio.

Handlebars.registerHelper('ifCond', function(v1, v2, options) {
  if(v1 === v2) {
    return options.fn(this);
  }
  return options.inverse(this);
});

Puoi quindi chiamare l'aiutante nel modello in questo modo

{{#ifCond v1 v2}}
    {{v1}} is equal to {{v2}}
{{else}}
    {{v1}} is not equal to {{v2}}
{{/ifCond}}

Altri suggerimenti

Prendere la soluzione un ulteriore passo avanti. Questo aggiunge l'operatore di confronto.

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

Usalo in un modello come questo:

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

Versione dello script di caffè

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

Il manubrio supporta operazioni nidificate. Ciò fornisce molta flessibilità (e codice più pulito) se scriviamo la nostra logica in modo leggermente diverso.

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

In effetti, possiamo aggiungere tutti i tipi di logica:

{{#if (or 
        (eq section1 "foo")
        (ne section2 "bar"))}}
.. content
{{/if}}

Basta registrare questi aiutanti:

Handlebars.registerHelper({
    eq: function (v1, v2) {
        return v1 === v2;
    },
    ne: function (v1, v2) {
        return v1 !== v2;
    },
    lt: function (v1, v2) {
        return v1 < v2;
    },
    gt: function (v1, v2) {
        return v1 > v2;
    },
    lte: function (v1, v2) {
        return v1 <= v2;
    },
    gte: function (v1, v2) {
        return v1 >= v2;
    },
    and: function () {
        return Array.prototype.slice.call(arguments).every(Boolean);
    },
    or: function () {
        return Array.prototype.slice.call(arguments, 0, -1).some(Boolean);
    }
});

Prendendo questo in più, per quelli di voi che vivono al limite.

GIST: https://gist.github.com/akhoury/9118682 Demo: Snippet di codice di seguito

Helper manubrio: {{#xif EXPRESSION}} {{else}} {{/xif}}

un aiutante per eseguire un'istruzione if con qualsiasi espressione

  1. L'espressione è una stringa correttamente sfuggita
  2. si tu BISOGNO per sfuggire correttamente ai letterali delle corde o semplicemente alternate singole e doppie citazioni
  3. Puoi accedere a qualsiasi funzione o proprietà globale IE encodeURIComponent(property)
  4. Questo esempio presuppone che tu abbia passato questo contesto al manubrio template( {name: 'Sam', age: '20' } ), Avviso age è un string, solo per così posso demo parseInt() Più tardi in questo post

Uso:

<p>
 {{#xif " name == 'Sam' && age === '12' " }}
   BOOM
 {{else}}
   BAMM
 {{/xif}}
</p>

Produzione

<p>
  BOOM
</p>

JavaScript: (Dipende da un altro aiutante, continua a leggere)

 Handlebars.registerHelper("xif", function (expression, options) {
    return Handlebars.helpers["x"].apply(this, [expression, options]) ? options.fn(this) : options.inverse(this);
  });

Helper manubrio: {{x EXPRESSION}}

Un aiutante per eseguire espressioni Javascript

  1. L'espressione è una stringa correttamente sfuggita
  2. si tu BISOGNO per sfuggire correttamente ai letterali delle corde o semplicemente alternate singole e doppie citazioni
  3. Puoi accedere a qualsiasi funzione o proprietà globale IE parseInt(property)
  4. Questo esempio presuppone che tu abbia passato questo contesto al manubrio template( {name: 'Sam', age: '20' } ), age è un string A scopo demo, può essere qualsiasi cosa ..

Uso:

<p>Url: {{x "'hi' + name + ', ' + window.location.href + ' <---- this is your href,' + ' your Age is:' + parseInt(this.age, 10)"}}</p>

Produzione:

<p>Url: hi Sam, http://example.com <---- this is your href, your Age is: 20</p>

JavaScript:

Questo sembra un po 'grande perché ho ampliato la sintassi e ho commentato quasi ogni riga per scopi di chiarezza

Handlebars.registerHelper("x", function(expression, options) {
  var result;

  // you can change the context, or merge it with options.data, options.hash
  var context = this;

  // yup, i use 'with' here to expose the context's properties as block variables
  // you don't need to do {{x 'this.age + 2'}}
  // but you can also do {{x 'age + 2'}}
  // HOWEVER including an UNINITIALIZED var in a expression will return undefined as the result.
  with(context) {
    result = (function() {
      try {
        return eval(expression);
      } catch (e) {
        console.warn('•Expression: {{x \'' + expression + '\'}}\n•JS-Error: ', e, '\n•Context: ', context);
      }
    }).call(context); // to make eval's lexical this=context
  }
  return result;
});

Handlebars.registerHelper("xif", function(expression, options) {
  return Handlebars.helpers["x"].apply(this, [expression, options]) ? options.fn(this) : options.inverse(this);
});

var data = [{
  firstName: 'Joan',
  age: '21',
  email: 'joan@aaa.bbb'
}, {
  firstName: 'Sam',
  age: '18',
  email: 'sam@aaa.bbb'
}, {
  firstName: 'Perter',
  lastName: 'Smith',
  age: '25',
  email: 'joseph@aaa.bbb'
}];

var source = $("#template").html();
var template = Handlebars.compile(source);
$("#main").html(template(data));
h1 {
  font-size: large;
}
.content {
  padding: 10px;
}
.person {
  padding: 5px;
  margin: 5px;
  border: 1px solid grey;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/handlebars.js/1.0.0/handlebars.min.js"></script>

<script id="template" type="text/x-handlebars-template">
  <div class="content">
    {{#each this}}
    <div class="person">
      <h1>{{x  "'Hi ' + firstName"}}, {{x 'lastName'}}</h1>
      <div>{{x '"you were born in " + ((new Date()).getFullYear() - parseInt(this.age, 10)) '}}</div>
      {{#xif 'parseInt(age) >= 21'}} login here:
      <a href="http://foo.bar?email={{x 'encodeURIComponent(email)'}}">
        	http://foo.bar?email={{x 'encodeURIComponent(email)'}}
        </a>
      {{else}} Please go back when you grow up. {{/xif}}
    </div>
    {{/each}}
  </div>
</script>

<div id="main"></div>

Moar

Se si desidera accedere all'ambito di livello superiore, questo è leggermente diverso, l'espressione è il join di tutti gli argomenti, l'uso: dire che i dati di contesto sembrano questo:

// data
{name: 'Sam', age: '20', address: { city: 'yomomaz' } }

// in template
// notice how the expression wrap all the string with quotes, and even the variables
// as they will become strings by the time they hit the helper
// play with it, you will immediately see the errored expressions and figure it out

{{#with address}}
    {{z '"hi " + "' ../this.name '" + " you live with " + "' city '"' }}
{{/with}}

JavaScript:

Handlebars.registerHelper("z", function () {
    var options = arguments[arguments.length - 1]
    delete arguments[arguments.length - 1];
    return Handlebars.helpers["x"].apply(this, [Array.prototype.slice.call(arguments, 0).join(''), options]);
});

Handlebars.registerHelper("zif", function () {
    var options = arguments[arguments.length - 1]
    delete arguments[arguments.length - 1];
    return Handlebars.helpers["x"].apply(this, [Array.prototype.slice.call(arguments, 0).join(''), options]) ? options.fn(this) : options.inverse(this);
});

C'è un modo semplice per farlo senza scrivere una funzione di supporto ... può essere fatto completamente all'interno del modello.

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

EDIT: al contrario puoi fare o farlo facendo questo:

{{#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}}

Modifica/Nota: dal sito Web del manubrio: manubriorsjs.com Ecco i valori falsy:

È possibile utilizzare l'helper IF per rendere condizionale un blocco. Se il suo argomento restituisce falso, indefinito, nullo, "" o [] (un valore "falsy"), allora qualsiasi "cond '" (come cond1 o cond2) non sarà considerato vero.

Un problema con tutte le risposte pubblicate qui è che non funzionano con le proprietà legate, ovvero la condizione IF non viene rivalutata quando le proprietà riguardavano il cambiamento. Ecco una versione leggermente più avanzata degli attacchi di supporto Helper. Usa il legamento Funzione dalla sorgente Ember, che viene anche utilizzata per implementare la normale brace #if aiutante.

Questo è limitato a una singola proprietà legata sul lato sinistro, confrontando con una costante sul lato destro, che penso sia abbastanza buono per la maggior parte degli scopi pratici. Se hai bisogno di qualcosa di più avanzato di un semplice confronto, allora forse sarebbe bene iniziare a dichiarare alcune proprietà calcolate e usare il normale #if Helper invece.

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

Puoi usarlo in questo modo:

{{#ifeq obj.some.property "something"}}
  They are equal!
{{/ifeq}}

Soluzione migliorata che funziona sostanzialmente con qualsiasi operatore binario (almeno numeri, le stringhe non funziona bene con Eval, si occupano di una possibile iniezione di script se si utilizza un operatore non definito con input utente):

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

Ecco un link al supporto blocco che uso: Aiutante a blocchi di confronto. Supporta tutti gli operatori standard e ti consente di scrivere il codice come mostrato di seguito. È davvero abbastanza utile.

{{#compare Database.Tables.Count ">" 5}}
There are more than 5 tables
{{/compare}}

Ecco una soluzione se si desidera controllare più condizioni:

/* 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);
  });

Uso:

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

{{#checkIf list.length '>' 0 '&&' public '==' true}} <p>condition satisfied</p>{{/checkIf}}

Simile alla risposta di Jim ma usando un po 'di creatività potremmo anche fare qualcosa del genere:

Handlebars.registerHelper( "compare", function( v1, op, v2, options ) {

  var c = {
    "eq": function( v1, v2 ) {
      return v1 == v2;
    },
    "neq": function( v1, v2 ) {
      return v1 != v2;
    },
    ...
  }

  if( Object.prototype.hasOwnProperty.call( c, op ) ) {
    return c[ op ].call( this, v1, v2 ) ? options.fn( this ) : options.inverse( this );
  }
  return options.inverse( this );
} );

Quindi per usarlo otteniamo qualcosa di simile:

{{#compare numberone "eq" numbretwo}}
  do something
{{else}}
  do something else
{{/compare}}

Suggerirei di spostare l'oggetto dalla funzione per prestazioni migliori, ma altrimenti puoi aggiungere qualsiasi funzione di confronto desideri, tra cui "e" o ".

Un'altra alternativa è utilizzare il nome della funzione in #if. Il #if Rileverà se il parametro è funzione e se lo è, lo chiamerà e utilizzerà il suo ritorno per il controllo della verità. Sotto MyFunction ottiene il contesto attuale come this.

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

Installare Ember Truth Helpers addon eseguendo il comando seguente

Ember Installa Ember-Truth-Helpers

Puoi iniziare a utilizzare la maggior parte degli operatori logici (EQ, Not-Eq, Not e, o, GT, GTE, LT, LTE, XOR).

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

Puoi anche includere la sottoespressione per andare oltre,

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

Sfortunatamente nessuna di queste soluzioni risolve il problema di "o" operatore "cond1 || cond2".

  1. Controlla se il primo valore è vero
  2. Usa "^" (o) e controlla se altrimenti cond2 è vero

    {{#if cond1}} fai l'azione {{^}} {{#if cond2}} fai l'azione {{/if}} {{/if}

Rompe la regola asciutta. Quindi perché non usare parziale per renderlo meno disordinato

{{#if cond1}}
    {{> subTemplate}}
{{^}}
    {{#if cond2}}
        {{> subTemplate}}
    {{/if}}
{{/if}}

Posso capire perché vorresti creare un aiutante per situazioni in cui hai un gran numero di confronti vari da eseguire all'interno del tuo modello, ma per un numero relativamente piccolo di confronti (o anche uno, che era ciò che mi ha portato a questa pagina il primo posto), probabilmente sarebbe solo più facile definire una nuova variabile di manubrio nella tua chiamata di funzione di rendering visivo, come:

Passare al manubrio su rendering:

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

E poi nel modello del manubrio:

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

Lo menziono per motivi di semplicità, e anche perché è una risposta che può essere rapida e utile pur rispettando la natura senza logica del manubrio.

Ho trovato un pacchetto NPM realizzato con CoffeeScript che ha molti incredibili aiutanti utili per il manubrio. Dai un'occhiata alla documentazione nel seguente URL:

https://npmjs.org/package/handlebars-helpers

Puoi fare un wget http://registry.npmjs.org/handlebars-helpers/-/handlebars-helpers-0.2.6.tgz per scaricarli e vedere il contenuto del pacchetto.

Sarai abiliti a fare cose come {{#is number 5}} o {{formatDate date "%m/%d/%Y"}}

Se vuoi solo verificare se l'uno o l'altro elemento sono presenti, puoi utilizzare questo aiutante personalizzato

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

come questo

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

Se devi anche essere in grado di avere un "o" per confrontarevalori di ritorno della funzionePreferirei aggiungere un'altra proprietà che restituisce il risultato desiderato.

Dopo tutto, i modelli dovrebbero essere senza logica!

Per coloro che hanno problemi a confrontare le proprietà dell'oggetto, all'interno dell'helper aggiungi questa soluzione

Ember.js helper non riconoscendo correttamente un parametro

Sono appena arrivato a questo post da una ricerca su Google su come verificare se una stringa è uguale a un'altra stringa.

Uso il manubrio di Nodejs sul lato server, ma utilizzo anche gli stessi file di modelli sul front-end utilizzando la versione browser di RubleBarsJS per analizzarlo. Ciò significava che se volessi un aiutante personalizzato, avrei dovuto definirlo in 2 luoghi separati o assegnare una funzione all'oggetto in questione - troppo sforzo !!

Ciò che le persone dimenticano è che alcuni oggetti hanno erediti funzioni che possono essere utilizzate nel modello di baffi. Nel caso di una stringa:

https://developer.mozilla.org/en-us/docs/web/javascript/reference/global_objects/string/match

An Array containing the entire match result and any parentheses-captured matched results; null if there were no matches.

Possiamo usare questo metodo per restituire una matrice di corrispondenze o null Se non sono state trovate corrispondenze. Questo è perfetto, perché guardare la documentazione del manubrio http://handlebarsjs.com/builtin_helpers.html

You can use the if helper to conditionally render a block. If its argument returns false, undefined, null, "", 0, or [], Handlebars will not render the block.

Così...

{{#if your_string.match "what_youre_looking_for"}} 
String found :)
{{else}}
No match found :(
{{/if}}

AGGIORNARE:

Dopo aver testato tutti i browser, Questo non funziona su Firefox. RubleBarsJS passa altri argomenti a una chiamata di funzione, il che significa che quando si chiama String.prototype.match, il secondo argomento (cioè i flag regexp per la chiamata di funzione di corrispondenza secondo la documentazione sopra) sembra essere superato. Firefox vede questo come un uso deprecato di String.prototype.match e così si rompe.

Una soluzione alternativa deve dichiarare un nuovo prototipo funzionale per l'oggetto String JS, e usalo invece:

if(typeof String.includes !== 'function') {
    String.prototype.includes = function(str) {
        if(!(str instanceof RegExp))
            str = new RegExp((str+'').escapeRegExp(),'g');
        return str.test(this);
    }
}

Assicurati che questo codice JS sia incluso prima esegui la tua funzione manubrio.compile (), quindi nel tuo modello ...

{{#your_string}}
    {{#if (includes "what_youre_looking_for")}} 
        String found :)
    {{else}}
        No match found :(
    {{/if}}
{{/your_string}}

Qui abbiamo manubrio alla vaniglia per più logici && e || (e o o):

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

Non sono così sicuro se sia "sicuro" da usare "e" e "o" ... forse cambiare in qualcosa come "op_and" e "op_or"?

Soluzione corretta per e/o per

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

Quindi chiama come segue

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

BTW: Si noti che la soluzione fornita qui non è corretta, non sta sottraendo l'ultimo argomento che è il nome della funzione.https://stackoverflow.com/a/31632215/1005607

Il suo originale e/o si basava sull'elenco completo degli argomenti

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

Qualcuno può cambiare quella risposta? Ho appena sprecato un'ora cercando di riparare qualcosa in una risposta consigliata da 86 persone. La correzione è a filtrare l'ultimo Argomento che è il nome della funzione. Array.prototype.slice.call(arguments, 0, arguments.length - 1)

Ancora un'altra soluzione storta per un aiutante ternario:

'?:' ( condition, first, second ) {
  return condition ? first : second;
}

<span>{{?: fooExists 'found it' 'nope, sorry'}}</span>

O un semplice aiuto Coalesce:

'??' ( first, second ) {
  return first ? first : second;
}

<span>{{?? foo bar}}</span>

Poiché questi personaggi non hanno un significato speciale nel markup del manubrio, sei libero di usarli per i nomi di aiutanti.

Seguendo queste 2 guide A-Way-to-Let-Users-Define-Custom-Custom-If-Statements e aiutanti legati al limite Sono stato in grado di regolare le mie visualizzazioni condivise in questo post su stackoverflow Per utilizzare questo anziché l'istruzione #if standard. Questo dovrebbe essere più sicuro del semplice lanciare un #if lì dentro.

Gli helper vincolati personalizzati in quel GIST sono eccezionali.

<li>
    <a href="{{unbound view.varProductSocialBlog}}">
        {{#if-equal view.showDiv "true"}}<div>{{/if-equal}}<i class="fa fa-rss-square"></i>{{#if-equal view.showDiv "true"}}</div>{{/if-equal}}
        {{#if-equal view.showTitle "true"}}Blog{{/if-equal}}
    </a>
</li>

Sto usando il Ember Cli Progetto per costruire la mia applicazione Ember.

Configurazione corrente al momento di questo post:

DEBUG: -------------------------------
DEBUG: Ember      : 1.5.1
DEBUG: Ember Data : 1.0.0-beta.7+canary.b45e23ba
DEBUG: Handlebars : 1.3.0
DEBUG: jQuery     : 2.1.1
DEBUG: -------------------------------

In ember.js puoi usare in linea se aiuta In If Block Helper. Può sostituire || Operatore logico, ad esempio:

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

Puoi farlo semplicemente usando l'operatore logico come questo mostrato di seguito:

{{#if (or(eq firstValue 'String_to_compare_value') (eq secondValue 'String_to_compare_value'))}}business logic goes here{{/if}}

{{#if (and(eq firstValue 'String_to_compare_value') (eq secondValue 'String_to_compare_value'))}}business logic goes here{{/if}}

Prima di chiudere se puoi scrivere la tua logica aziendale

Ecco un approccio che sto usando per Ember 1.10 e 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));
});

Quindi puoi usarlo nei tuoi modelli in questo modo:

// 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}}

Dove gli argomenti all'espressione vengono passati come p0,p1,p2 ecc. e p0 può anche essere referenziato come this.

Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow
scroll top