Printing HTML code inside Meteor Template

Question

How can I print HTML code inside a Meteor template using handle/spacebars?

When I try to manipulate the <div> element using a simple variable containing a style="" code, it generates an error. For example:

<div {{style}}>
    // Something in here.
</div>

Will fail if {{style}} is something along the line of 'style="something: something;"' set from the Template.helpers.

How can I print HTML code inside the template?

you are looking for this http://stackoverflow.com/questions/7168469/handlebars-template-rendering-template-as-text — ncubica, Nov 20 '14 at 09:00

score 2 · Answer 1 · answered Nov 20 '14 at 08:26

2

I don't know if it's possible to use variables inside an HTML tag, but if want to pass HTML code from your variable to the client, simply use {{{variable}}} instead of {{variable}}.

answered Nov 20 '14 at 08:26

dasniko

484
2
7

I came here from google as I needed a SpaceBars helper to return HTML complete with tags, and this solved it. Thanks! – Bart S Apr 17 '18 at 14:26

score 2 · Accepted Answer · answered Nov 20 '14 at 09:23

What you're trying to do here in particular:

<div {{style}}>
  <!-- Something in here. -->
</div>

With {{style}} evaluating to 'style="key: value;"' is impossible in Blaze, however it will work if {{style}} evaluates to an object {style: "key: value;"}. Alternatively, this will also work:

<div style="{{style}}">
  <!-- Something in here. -->
</div>

With {{style}} evaluating to the string key: value.

The triple brace {{{helper}}} cannot be used to insert attributes, but it can otherwise be used to insert arbitrary HTML nodes without escaping. If you use it, be sure you aren't opening up an XSS hole.

See this meteorpad.

Printing HTML code inside Meteor Template

2 Answers2