loops in underscore js template

Question

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\'}];

Answer 1

You'd probably want to do two things:

1. Adjust the data you supply to the template:

   $(this.el).html(this.template({
       action: this.model.toJSON()
   }));
   

2. Adjust the inner part of the template to use acs.label instead of label:

   <a class="btn"><%= acs.label %></a>
   

Demo: http://jsfiddle.net/ambiguous/xczBy/

On second thought, I think you should be working with a collection rather than a single model. You'd want to add this:

var ActionCollection = Backbone.Collection.extend({
    model: Action
});

And then adjust render to use this.collection:

    $(this.el).html(this.template({
        actions: this.collection.toJSON()
    }));

And then start things up like this:

var actions = new ActionCollection(acs);
var actionView = new ActionView({collection: actions});

And finally, refer to actions in the template:

<% _.each(actions, function(acs) { %> 

Demo: http://jsfiddle.net/ambiguous/6VeXk/

This would better match Backbone's key/value based models.