Javascript 主干下划线模板不工作

这是我在HTML选项卡中的JSFIDLE代码：

<script type="text/template" id="vehicleItemTemplate">
    <li><% = Color %> - <% = Type %></li>
</script>

<ul id="vehicles">
</ul>

当我运行这段代码时，我得到

SyntaxError: syntax error

= Color

在Firebug控制台选项卡中。我错过了什么

编辑：根据发布的链接编辑新代码：

var Vehicle = Backbone.Model.extend({});
var vehicle1 = new Vehicle({Color:'blue', Type: 'car'});
var vehicle2 = new Vehicle({Color:'blue', Type: 'bike'});
var vehicle3 = new Vehicle({Color:'blue', Type: 'rickshaw'});

var VehicleCollection = Backbone.Collection.extend({ model : Vehicle});
var vehicleCollection = new VehicleCollection([vehicle1,vehicle2,vehicle3]);


var VehicleView = Backbone.View.extend({
    initialize: function(){            
        this.template = _.template($('#vehicleItemTemplate').html());
        this.collection.bind("reset", this.render, this);
    },
    render: function(){        
        var renderedContent = this.template(this.collection.toJSON());
        this.$el.html( renderedContent);
        return this;
    }
});

var vehicleView = new VehicleView({el: "#vehicles", collection:vehicleCollection});
vehicleView.render();

---

是的，这是正确的行为-您试图通过模型视图呈现集合。集合没有属性颜色，您有一个错误。结帐

---

最后，我在不创建其他视图的情况下寻找的答案是：

var Vehicle = Backbone.Model.extend({});
var vehicle1 = new Vehicle({Color:'blue', Type: 'car'});
var vehicle2 = new Vehicle({Color:'blue', Type: 'bike'});
var vehicle3 = new Vehicle({Color:'blue', Type: 'rickshaw'});

var VehicleCollection = Backbone.Collection.extend({ model : Vehicle});
var vehicleCollection = new VehicleCollection([vehicle1,vehicle2,vehicle3]);


var VehicleView = Backbone.View.extend({
    initialize: function(){            
        this.template = _.template($('#vehicleItemTemplate').html());
        this.collection.bind("reset", this.render, this);
    },
    render: function(){        
        var renderedContent = this.template({vehicles: this.collection.models});
        this.$el.html( renderedContent);
        return this;
    }
});

var vehicleView = new VehicleView({el: "#vehicles", collection:vehicleCollection});
vehicleView.render();

HTML:

-

好吧，那还是不行。请按照张贴的链接检查编辑。@杰克帮了你吗？

$(function(){
    var Vehicle = Backbone.Model.extend(),
        VehicleCollection = Backbone.Collection.extend({ model : Vehicle});


    var vehicle1 = new Vehicle({Color:'blue', Type: 'car'}),
        vehicle2 = new Vehicle({Color:'blue', Type: 'bike'}),
        vehicle3 = new Vehicle({Color:'blue', Type: 'rickshaw'}),
        vehicleCollection = new VehicleCollection([vehicle1,vehicle2,vehicle3]);


    var itemView = Backbone.View.extend({
            template: _.template($('#vehicleItemTemplate').html()),
            render: function(){        
                var renderedContent = this.template(this.model.toJSON());
                this.$el.html( renderedContent);
                return this;
            }
        }),
        collectionView = Backbone.View.extend({
            render: function () {
                this.collection.each(this.addOne, this);
                return this;
            },
            addOne: function(mod) {
                var item = new itemView({ model: mod });
                this.$el.append( item.render().el );
            }
        });


    var vehicleView = new collectionView({
        el: "#vehicles", 
        collection:vehicleCollection
    });

    vehicleView.render();
});

var Vehicle = Backbone.Model.extend({});
var vehicle1 = new Vehicle({Color:'blue', Type: 'car'});
var vehicle2 = new Vehicle({Color:'blue', Type: 'bike'});
var vehicle3 = new Vehicle({Color:'blue', Type: 'rickshaw'});

var VehicleCollection = Backbone.Collection.extend({ model : Vehicle});
var vehicleCollection = new VehicleCollection([vehicle1,vehicle2,vehicle3]);


var VehicleView = Backbone.View.extend({
    initialize: function(){            
        this.template = _.template($('#vehicleItemTemplate').html());
        this.collection.bind("reset", this.render, this);
    },
    render: function(){        
        var renderedContent = this.template({vehicles: this.collection.models});
        this.$el.html( renderedContent);
        return this;
    }
});

var vehicleView = new VehicleView({el: "#vehicles", collection:vehicleCollection});
vehicleView.render();

<script type="text/template" id="vehicleItemTemplate">    
    <% _.each(vehicles, function(vehicle){ %>
            <li><%=vehicle.get('Color')%> - <%=vehicle.get('Type')%></li>
    <% }); %>
</script>

<ul id="vehicles">
</ul>