/*the view/template refers to individual items being added to the to do list*/
/*this is the bare minimum code needed*/
/*#item-template: there can only be one*/
<!-- Templates -->
<script type="text/template" id="item-template">
<label><%- title %></label>
</script>
// renders individual todo items list (li)
app.TodoView = Backbone.View.extend({
tagName: 'li',
template: _.template($('#item-template').html()),
render: function(){
this.$el.html(this.template(this.model.toJSON()));
return this; // enable chained calls
}
});
-the content of your template view is what is inside the <script id> </script>
- this.$el.html(this.template(this.model.toJSON()) this line is what is setting the value of each individual view/template's html. Without it.
-For example. If you instead wrote this.$el.html("hello world") , each element would just be "hello world".
- <input class="edit" value="<%- title %>"> is the this.input= this.input = this.$('.edit');
While commonly used, template is NOT A default function/property of view, it is added in afterwards….during Backbone.View.extend({/*here*/}} you can add ANY property…{clown: , pies: } are all okay…
Inside of template you add the value of the variables you want to use inside of the template