Using mustache to fill in a html tag argument

Question

I'm trying the append an identier (id) to the href below using mustache

Template:

<div id='tmpl'>
    <a href='#product_detail?'{{id}}>link</a>
</div>    

var template = $('#tmpl').html();

Data:

var model = { id: 22 };

Rendering the template using the model data:

var html = Mustache.to_html(template, model);

results in:

<a href="#product_detail?%7B%7Bid%7D%7D">link</a>

If the template is changed to:

<div id='tmpl'>
    <a href='#product_detail?'{{id}}>link</a>
</div>

The resulting template is:

<a href="#product_detail?" 0="">link</a>

The 'problem' seems to be that jQuery is changing the single quotes in the template to double quotes that confuses mustache. Placing the mustache tag outside the quotes doesn't give the right results either. How can this be solved?

Thanks

score 10 · Accepted Answer · answered Nov 15 '11 at 14:22

10

You need to add the {{id}} in the href, like that :

href="#product_detail?{{id}}"

We used to put our mustache template in a script with type="text/template", i don't know if it will solve your escaping problems but we haven't here.

<script type="text/template" id="tmpl">
   <a href href="#product_detail?{{id}}">link</a>
</script>

If you got some escaping problems use the & before the id like that:

<script type="text/template" id="tmpl">
   <a href href="#product_detail?{{& id}}">link</a>
</script>

Hope it help !

answered Nov 15 '11 at 14:22

iRyusa

384
2
13

Replacing
by
– donnut Nov 15 '11 at 14:26
3

@iRyusa What exactly does the "&" option do? – Skytiger Apr 20 '15 at 07:46
@wazz Thank you! That wasn't available when I asked the question :P – Skytiger Jun 01 '20 at 20:09

score 0 · Answer 2 · answered Jan 28 '21 at 13:09

0

I resolved this issue pay placing ${id} into the attribute instead of {{id}} ex:

<button class="fisherytiles" type="button" data-myid="${Id}" id="imagelink">

answered Jan 28 '21 at 13:09

Nicholas McIver

11
1

Using mustache to fill in a html tag argument

2 Answers2

Linked