Created
January 23, 2017 11:20
-
-
Save andersdn/98b4a1a459d1122bd452a329e80fa0c6 to your computer and use it in GitHub Desktop.
some underscore templating
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!doctype html> | |
<html> | |
<head> | |
<meta charset="utf-8"> | |
<title>TITLE</title> | |
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0"> | |
</head> | |
<body> | |
<div id="container"> | |
</div> | |
<!-- jquery and underscore is overkill for this, but it makes it quicker --> | |
<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script> | |
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> | |
<script type="html/template" id="template_name_here"> | |
<h1>foo</h1> | |
<ul> | |
<% _.each(messages,function(i){ %> | |
<li><%= i.name %> : <%= i.message %></li> | |
<% }); %> | |
</ul> | |
</script> | |
<script> | |
// could be ajax, isnt | |
var json_content = { | |
messages:[ | |
{'name':'foo','message':'bar'}, | |
{'name':'foo2','message':'bar2'} | |
] | |
} | |
$(document).ready(function(){ | |
var tpl = _.template($('#template_name_here').html()); | |
$("#container").html(tpl(json_content)); | |
}) | |
</script> | |
</div> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment