Persistent templates (or re-using templates) with Hogan / Mustache?

0
votes

Not entirely sure if "persistent templates" is what I am after, this is the first time I am using a Javascript templating engine. I am curious if there is a way of keeping the template data intact for the purposes of re-rendering a document once it has been rendered...

An example -- I define a simple template snippet:

<div id="price">Price: {{current_price}}</div>

I render it:

var template = Hogan.compile($("#price").html())
$("#price").html(template.render(price_data))

Let's say I want to update the price information every X seconds (fire a request, grab JSON and push it back to #price), re-rendering the template fails as there is no {{current_price}} any more. I could just do something along the lines of $('#price').text('Price: ' + price_data) after a succesful request but I feel this somehow makes the idea behind using templates useless.

So the question is, what is a way to re-use templates on a document? Cache the template data into a variable and re-use it when rendering or is there a more clever way?

Thanks.

1
javascripttemplatesmustachehogan.js

1 Answers

1
votes

You shouldn't be using a thing as its own template, you'll run into all sorts of problems (especially once you start adding mustache tags to attributes, or conditionally showing html tags, or anything like that).

Make your template its own element on the page. And do yourself a favor and use a <script type="text/x-mustache"> tag for it.