Handlebar if condition not working

Question

Unable to use if condition in Handlbars template. Below is my jquery Handlebars function below,

$.each(data.response, function (i, item) {
   var source = $("#my-orders").html();
   var template = Handlebars.compile(source);
   html += template(item);
   //alert(html);
});
if(html){
   $("#myorderss").html(html);
}

When I'm using if condition, its not working.

{{#if id=='1'}}
{{/if}}

How to use if condition in handlebars template?

try {{#if id}} as this checkes for "truthy" values, else u might need to include an "equals" helper function for more complex match checks — Sajjan Sarkar, Jan 31 '18 at 12:56
@SajjanSarkar i have to meke 4 if condition and compare the id, i need to do it — RAHUL PRAJAPATI, Jan 31 '18 at 12:58
Use `Handlebar helpers` for it: https://stackoverflow.com/questions/8853396/logical-operator-in-a-handlebars-js-if-conditional Handlebars offers support for subexpressions, which allows you to invoke multiple helpers within a single mustache, and pass in the results of inner helper invocations as arguments to outer helpers. — Kunj, Jan 31 '18 at 13:01
You unfortunately can only check a boolean condition using this syntax. If you need to check for a value, then use helpers — JSEvgeny, Jan 31 '18 at 13:03
try this 'https://stackoverflow.com/questions/15088215/handlebars-js-if-block-helper' — Sajjan Sarkar, Jan 31 '18 at 13:11
Possible duplicate of [Handlebars.js if block helper ==](https://stackoverflow.com/questions/15088215/handlebars-js-if-block-helper) — Gibin Ealias, Feb 06 '18 at 09:15

score 1 · Answer 1 · answered Jan 31 '18 at 15:04

This is a misunderstanding of the if condition. Look at the #if documentation here : 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.

What you need to do is a handlebar helper to test your condition.

Here is one example of a "test" helper that I use to do comparisons :

Handlebars.registerHelper('test', function(lvalue, operator, rvalue, options) {
    var doDisplay = false;
    var items = (""+rvalue).split("|");
    var arrayLength = items.length;
    for (var i = 0; (i < arrayLength); i++) {
        if (operator == "eq") {
            if (lvalue == items[i]) {
                doDisplay = true;
            }
        } else if (operator == "ne") {
            if (lvalue != items[i]) {
                doDisplay = true;
            }
        } else if (operator == "gt") {
            if (parseFloat(lvalue) > parseFloat(items[i])) {
                doDisplay = true;
            }
        } else if (operator == "lt") {
            if (parseFloat(lvalue) < parseFloat(items[i])) {
                doDisplay = true;
            }
        }else if (operator == "le") {
            if (parseFloat(lvalue) <= parseFloat(items[i])) {
                doDisplay = true;
            }
        }else if (operator == "ge") {
            if (parseFloat(lvalue) >= parseFloat(items[i])) {
                doDisplay = true;
            }
        }
    }
    if (doDisplay) {
        return options.fn(this);
    } else {
        return "";
    }
});

and here is how you call it for example if you and to test and display a result depending on the test:

{{#test id 'eq' '1'}}
{{id}} equals 1
{{/test}}
{{#test id 'ne' '1'}}
{{id}} do not equals 1
{{/test}}
{{#test id 'ge' '1'}}
{{id}} greater or equals 1
{{/test}}
{{#test id 'ne' '1'}}
{{id}} lower or equals 1
{{/test}}

If you know enough more, can you elaborate? Reading the Handlebars documentation, I would think it means the if block's "argument" fails the test if it is literally a Javascript value of false, null, 0, etc. But simply assigning the argument that value does not work. (e.g. `'arg': false` passed in is still truthy.) Then, I might note it says if the argument "returns false"... So the argument must be a function, which returns the value to test. This matches other usages I see in my project, as well as the Helpers notion. But this too isn't working. What exactly is if doing to test the value? — GG2, Jul 08 '20 at 20:13
Nevermind, sorta -- answered my own question. Found their GitHub. #if appears to accept either values of either Javascript basic datatypes or a function. And providing the if block a basic datatype directly (such as false, null, etc.) worked -- once I fixed my own code to solve a problem further down that was making Handlebars appear to always evaluate as "truthy". — GG2, Jul 08 '20 at 21:50

Handlebar if condition not working

1 Answers1

Linked