Applying a Handlebars template in JavaScript code

Question

I'm trying to use Ember's Handlebars engine for a not UI related purpose. I have a series of text templates (basically placeholders + static text), like

Order number {{number}} / {{year}}

I'm using the following code in a controller function (simplified here for the sake of the example):

formattedTitle: function(order) {
   var orderTitle = "Order number {{number}} / {{year}}";
   var template = Handlebars.compile(orderTitle);
   return template(order);
}

offer is a Ember.data record, containing both fields.

When I run the function the resulting string only contains the static text:

Order number /

It only works with the {{id}} property, probably because you can do order.id on the Ember.data record, but not order.number (you have to use get - order.get("number"))

Any idea how to solve this?

CraigTeegarden · Accepted Answer · 2013-07-17 19:37:13Z

3

You could use the Ember's Object.getProperties() to pull multiple properties into a simple javascript object and pass that in as the Handlebars context. Not sure that this is the best way to do this, though...

formattedTitle: function() {
    var order = Ember.Object.create({number: 1, year: 2013});
    // retrieve the properties ahead of time using Ember getter
    var orderContext = order.getProperties(['number', 'year']);
    var orderTitle = "Order number {{number}} / {{year}}";
    var template = Handlebars.compile(orderTitle);
    var output = template(order);
    return output;
}

JSBin example

edited Jul 17, 2013 at 19:37

answered Jul 17, 2013 at 16:59

CraigTeegarden

8,2558 gold badges40 silver badges43 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

splattne Over a year ago

Yes, that's a nice solution. Thank you!

splattne · Accepted Answer · 2013-07-18 11:45:19Z

2

Try something like this:

function formattedTitle(order) {
  var number = order.get('number');
  var year = order.get('year');
  var orderContext = { number: number, year: year };
  var orderTitle = "Order number {{number}} / {{year}}";
  var template = Handlebars.compile(orderTitle);
  var output = template(orderContext);

  return output;
}

edited Jul 18, 2013 at 11:45

splattne

104k54 gold badges206 silver badges250 bronze badges

answered Jul 17, 2013 at 16:34

intuitivepixel

23.3k3 gold badges59 silver badges51 bronze badges

1 Comment

splattne Over a year ago

I guess you forgot something. But I understand what you intended. Thanks.

Collectives™ on Stack Overflow

Applying a Handlebars template in JavaScript code

2 Answers 2

1 Comment

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related