Menu
I wrote a simple helper for my template. Here's the code:
Handlebars.registerHelper('splitQuote', function (string) { if (string.indexOf('|') !== -1) { return string.replace('|', '<span>') + '</span>'; } return string; }); So I pass a string, and split the string by '|' character. I also want to put second part into span tags.
Problem is, the result that is being returned is pure text, so I get span tags like a text, not HTML.
Does anyone know what's the catch?
Tnx
870
The if helper can be used as a ternary operator by passing three arguments to it. In the following example, a button has a default value of "Save Changes" , but when model. isSaving is true, then the value temporarily changes to Saving... .
Handlebars supports {{else if}} blocks as of 3.0. 0. is the point in not having an elsif (or else if) in handlebars that you are putting too much logic into your template.
You can use the unless helper as the inverse of the if helper.
Helpers in handlebars are function which will perform a certain action on given input & returns with the output. Some of the in-built helpers are #if, #unless, #each, #with, log & lookup. It is an inbuilt block helper, used to check conditional statements in handlebars. If the value is false the content inside the if block is rendered.
When writing a conditional, you will often want to make it possible for templates to provide a block of HTML that your helper should insert if the conditional evaluates to false. Handlebars handles this problem by providing generic else functionality to block helpers.
Parameters are passed to helpers in the order that they are passed, followed by the options hash. A common use-case for block helpers is using them to define custom iterators. In fact, all Handlebars built-in helpers are defined as regular Handlebars block helpers.
Handlebars.Utils.extend (foo, {bar: true}) Will set the key bar on object foo with the value true. Generic toString method. Determines if an object is an array. Determines if an object is a function. Logger used by the log helper. May be overridden if desired.
You don´t need to use SafeString. Instead, use the "triple moustaches" from handlebar:
From Handlebars web site, HTML Escaping section:
Handlebars HTML-escapes values returned by a {{expression}}. If you don't want Handlebars to escape a value, use the "triple-stash", {{{.
So, a simple triple quote in your html will avoid escaping:
{{{splitQuote}}} You have to mark the string as html in your helper if you want to Handlebars not to escape it. Use Handlebars.safeString to do this. The below should suit your needs
Handlebars.registerHelper('splitQuote', function(string) { if (string.indexOf('|') !== -1) { return new Handlebars.SafeString(string.replace('|', '<span>') + '</span>'); } return string; }); As mentioned in comments you should probably escape the passed string using Handlebars.Utils.escapeExpression(string) to encode the string before you do your custom formatting. I'd recommend writing like this:
Handlebars.registerHelper('splitQuote', function(string) { string = Handlebars.Utils.escapeExpression(string); if (string.indexOf('|') !== -1) { string = string.replace('|', '<span>') + '</span>'; } return new Handlebars.SafeString(string); // mark as already escaped }); If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
