Skip to content

Instantly share code, notes, and snippets.

@devdays

devdays/ojs-mustacheexample.html

Created December 16, 2014 21:29
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save devdays/5917387995cb3b5eab3c to your computer and use it in GitHub Desktop.
Save devdays/5917387995cb3b5eab3c to your computer and use it in GitHub Desktop.
Download ZIP
Object JavaScript - Mustache Example
Raw
ojs-mustacheexample.html
<!DOCTYPE html>
<html>
<head>
<title>Mustache</title>
</head>
<body>
<div class="main-content">
<div>
<h1>All Products</h1>
<ul id="products"></ul>
</div>
</div>
<div id="sampleArea"></div>
<script src="Scripts/jquery-2.0.2.min.js"></script>
<script src="Scripts/mustache.js"></script>
<script>
var data = {
products: [
{
id: 1,
name: "Toy1",
category: "Toy",
price: 45.03,
freshness: new Date()
},
{
id: 2,
name: "Toy2",
category: "Toy",
price: 35.20,
freshness: new Date()
}
]
};
console.log(JSON.stringify(data));
var template = "Products:<ul>{{#products}}" +
"<li>{{name}} {{category}} {{price}}</li>" +
"{{/products}}</ul>";
var html = Mustache.to_html(template, data);
$('#sampleArea').html(html);
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment