how to use ternary operator in mustache template

Question

I have a scenario where I am getting {{isdone}} value with Boolean data.

I want to be printed as "pending" for false value and "Done" for true.

I'm using below code, Which isn't working.

{{isdone}} == false ? "pending" : "Done"

Mustache templates are said to be "logic-less", though you can have `if/else` statements in them (See this question for more info : https://stackoverflow.com/questions/6027525/how-do-i-accomplish-an-if-else-in-mustache-js). I highly doubt a ternary operator is possible in a template. — Seblor, Jul 03 '18 at 09:04

score 2 · Answer 1 · answered May 17 '21 at 17:05

Use the `^` block for else.

You can (now) use the ^ block for an else or false condition. Something like this should work:

{{#isdone}}Done{{/isdone}}{{^isdone}}pending{{/isdone}}

Or as a more readable multi-line block of code:

{{#isdone}}
Done
{{/isdone}}
{{^isdone}}
pending
{{/isdone}}

score 1 · Accepted Answer · answered Mar 10 '20 at 10:51

As long as you have control of your context data, correct way is to pass another variable, that will already contain pending or Done beforehand.

If you don't have control over the data, then maybe moustache isn't good for you as you may need template engine that can have some more logic in it to transform data a bit.

score 0 · Answer 3 · answered Jun 28 '22 at 14:44

You might want to register a ternary helper for that

Handlebars.registerHelper("ternary", function (condition, trueValue, falseValue, options) {
   return condition ? trueValue : falseValue;
});

and then in your templates use it like

{{ternary isdone "Done" "pending"}}

how to use ternary operator in mustache template

3 Answers3

Use the ^ block for else.

Use the `^` block for else.