Can't access array value using tables #295

Closed
marianocifre opened this Issue Feb 15, 2013 · 5 comments

Comments

Projects
None yet
2 participants

Hi,

Something is wrong when accessing to the value of an array inside of a

.
It doesn't work if it is used between tags. Please, see the example below. Output is:

Works but not what I need:
1 2 3
Doesn't work:
[object Object] 
<!DOCTYPE html>

<html>
<head>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <script src="https://raw.github.com/janl/mustache.js/0.7.2/mustache.js"></script>
</head>

<body>
<div id="template" style="display:none">
  <p>Works but not what I need:</p>
  <p>{{#numbers}} {{.}} {{/numbers}} </p>
  <p>Doesn't work:</p>
  <table>
      <tr>
        {{#numbers}} <th> {{.}} </th> {{/numbers}}
      </tr>
  </table>
</div>
<div id="rendered"></div>
<script>
var json = {
  "numbers": [ 1, 2, 3 ]
  };
var compiledTemplate = Mustache.to_html($('#template').html(), json).replace(/^\s*/mg, '');
$('#rendered').html(compiledTemplate);
</script>
</body>
</html>

Is there anything I can do as a workaround?

Thanks,
Mariano.

Note that the code above doesn't work at all using the ¿latest? version used in mustache home page http://mustache.github.com/
Replace:

    <script src="https://raw.github.com/janl/mustache.js/0.7.2/mustache.js"></script>

with:

    <script src="http://mustache.github.com/extras/mustache.js"></script>

Update, and it doesn't work using multiline:

<tr>
    {{#weekDays}}
        <th>
            {{.}}
        </th>
    {{/weekDays}}
</tr>

Same [object Object] result.

ywjno commented Feb 19, 2013

Would you like this?

<!DOCTYPE html>
<html>
<head>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <script src="https://raw.github.com/janl/mustache.js/0.7.2/mustache.js"></script>
</head>
<body>
<div id="template" style="display:none">
  <p>Works but not what I need:</p>
  <p>{{#numbers}} {{.}} {{/numbers}} </p>
  <p>Doesn't work:</p>
  <table>
      <tr>
        {{#numbers}} {{{th}}} {{/numbers}}
      </tr>
  </table>
</div>
<div id="rendered"></div>
<script>
var json = {
  "numbers": [ 1, 2, 3 ],
  "th": function () {
    return "<th>" + this + "</th>"
  }
};
var compiledTemplate = Mustache.to_html($('#template').html(), json);
$('#rendered').html(compiledTemplate);
</script>
</body>
</html>

Hi Thomas,

Well, not exactly, because it is no rendered inside the tr table element.

Screen Shot 2013-02-19 at 2 05 05 PM

Thanks anyways. Is there any other way to do it?

Thanks,
Mariano.

Finally, this is what I did.
Replaced the div element template, to a script element:

from <div id="template" style="display:none"> to <script id="template" type="text/x-mustache-template">

And worked as expected =)

Thanks!
Mariano.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment