underscore.js-templating

Need some opinions on the best way to manage templating in Underscore. I'm building a Backbone app and using Underscore to manage the templates. I started off by doing something like this in a 'template.js' file. templates = { template1: '<h1>Some HTML</h1>', template2: '<h1>Some more HTML and a <%= variable %></h1> ... } This gets messy. Fast. So, I looked into RequireJS's text plugin and that makes it much cleaner. Now, I have a bunch of HTML files, and I essentially store it into my 'templates' object. Something like this: define(['text!/templates/template1.html', 'text!/templates/template2

I want to do something like this: <script id="tmpl-books" type="text/template"> <ul> <% for (var i = 0; i < books.length; i++) { %> <% var book = books[i]; %> <li> <em><%= book.title %></em> by <%= book.author %> </li> <% } %> </ul> </script> in my code, but I am using JSP so I have to use the {{ }} notation, but when I do this {{ for(var... }} does not work. <script id="tmpl-books" type="text/template"> <ul> {{ for (var i = 0; i < books.length; i++) { }} <% var book = books[i]; %> <li> <em>{{= book.title }}</em> by {{ book.author }} </li> {{ } }} </ul> </script> How can I achieve this? mu is

I have some templates for my frontend code, like: <div class="row"> <div class="my-header col-md-1"> <!-- comments --> {{ title }} </div> <div class="my-container col-md-11"> {% if (content) { %} {{ content }} {% } else { %} <p>Empty</p> {% } %} </div> </div> And I'm using grunt-contrib-jst to store them all in a single file and then on another build step will be included in a single JS file and that file is pushed to the CDN. This part is working perfectly, but I want to use the processContent option to minify the HTML template code, which contains Undercore template delimiters ( <%...%>

Ok guys so I have this array of key pair values which I'm using as my model: var acs = [{'label':'input box'},{'label':'text area'}]; the rest of the code goes as follows var Action = Backbone.Model.extend({}); var action = new Action(acs); var ActionView = Backbone.View.extend({ tagName:"li", template: _.template($('#actions-template').html()), events:{ "click":"makeInput" }, render:function(){ $(this.el).html(this.template(this.model.toJSON())); $(".hero-unit>ul").append(this.el); return this; }, makeInput:function(){ alert("im in"); } }); var actionView = new ActionView({model:action});

I am trying to render an underscore template which is the one below div.col-md-12#english select(value="", class="form-control") option | Select Your Language Preference script(type="text/template" id="english-pref") <% if (selected === "US") { %> option(value="US", selected) | United States <% } else %> <% if(selected === "US"){ %> option(value="UK", selected) | United Kingdom <% } %> Here is my Backbone View code app.NotesView = Backbone.View.extend({ el: '#notes', events: { 'click #save': 'save', 'click #update': 'update' }, template1: _.template($('#about').html()), template2: _.template($

I was just wondering how you use the underscore templates in a .aspx view since the <%= %> tags that underscore uses get picked up by the .aspx rendering engine and give me errors. For instance: <script type="text/template" id="my-template"> <span class="event" title="<%= description %>"> <%= title %> </span> </script> This template gives me an error since the .aspx rendering engine thinks I'm trying to bind this stuff to the Model. Thanks. From the fine manual : template _.template(templateString, [data], [settings]) [...] If ERB-style delimiters aren't your cup of tea, you can change