Question

I have a custom handlebar helper:

Handlebars.registerHelper('foo', function(key) {
    return (key + ' bar');
});

and in my html I have:

{{foo beer}}

the result is

<div id="ember127" class="ember-view">beer bar</div>

how can I make my own handlebar helper act like the ember {{unbound beer}} and just produce “beer bar” without any additional markup ?

Answer 1

So I think you might be confused on how the helpers, templates, and Ember views work exactly. The markup you created is expected and is the exact markup you’d get with a working unbound helper.

Ember.Handlebars templates are always placed within an Ember view object (as you have above). Something that a normal bound helper would produce would be:

<div id="ember127" class="ember-view">
  <script id="metamorph-1-start" type="text/x-placeholder"></script>
      beer bar
  <script id="metamorph-1-end" type="text/x-placeholder"></script>
</div>

Now if you want to surround your string with some other tag than a div (lets say an anchor tag or something), then you’d need to create a view, set it’s template and tag name, then append that view.

Take a look at this jsFiddle and take a look at the results pane in your inspector for some examples of what I’m talking about. Hope that clears things up for you.