Backbone.js 下划线模板在主干中不起作用

在my view.js中，我调用了葡萄酒列表tpl模板，如下所示。但索引页上没有显示任何内容。请帮忙

在index.html中

我已经在本地存储中添加了一些数据，我只想将这些数据显示到特定的div元素中

---

在酒单视图中，我得到了所有这些数据。意思是当我写作时，console.logthis.model.get'name'；我得到了我想要的数据，但我只想通过模板将这些数据显示给那个特定的div。我应该怎么做，请建议。

这就是您的代码应该如何获得预期的结果

var WineLists = Backbone.View.extend({
    el: '.wine-list',
    render: function () {
        var _self = this;
        this.collection.each(function (model) {
            var view = new WineListItemView({
                model: model
            })
            view.render();
            view.$el.appendTo(_self.el);
        })
        return this;
    }
});



var WineListItemView = Backbone.View.extend({
    template: _.template($('#wine-list-tpl').html()),
    render: function () {
        this.$el.html(this.template(this.model.toJSON()));
        return this;
    }
});

var wines = new Backbone.Collection([{
    name: 'wine1'
}, {
    name: 'wine2'
}])
var wineListView = new WineLists({
    collection: wines
});
wineListView.render()

---

先生，我已经在本地存储中添加了一些数据，我只想将这些数据显示到特定的div元素中。在WineLists视图中，我正在获取所有这些数据。意思是当我写作时，console.logwine.get'name'；我得到了我想要的数据，但我只想通过模板将这些数据显示给那个特定的部门。我应该怎么做，请建议。

var WineLists = Backbone.View.extend({

el:'.wine-list',

template : _.template($('#wine-list-tpl').html()),

render: function(){
    console.log("rendering is ok");
    this.$el.html( this.template( this.model.toJSON() ));
    return this;
    }
}); 

var WineList = Backbone.View.extend({
model:wines,

initialize: function(){ 
    var self=this;
    wines.fetch();
    _.each(this.model.toArray(), function(wine, i){

        $('#wine-list').append((new WineLists({ model : wine })).render().$el);

        });
    }
});

var wineListView = new WineList();

var WineLists = Backbone.View.extend({
    el: '.wine-list',
    render: function () {
        var _self = this;
        this.collection.each(function (model) {
            var view = new WineListItemView({
                model: model
            })
            view.render();
            view.$el.appendTo(_self.el);
        })
        return this;
    }
});



var WineListItemView = Backbone.View.extend({
    template: _.template($('#wine-list-tpl').html()),
    render: function () {
        this.$el.html(this.template(this.model.toJSON()));
        return this;
    }
});

var wines = new Backbone.Collection([{
    name: 'wine1'
}, {
    name: 'wine2'
}])
var wineListView = new WineLists({
    collection: wines
});
wineListView.render()

var WineLists = Backbone.View.extend({

model: new Wine(),

template : _.template($('#myTpl').html()),

render: function(){
//console.log(this.model.get('name'));
this.$el.html(this.template(this.model.toJSON()));
return this;
} });   

var WineList = Backbone.View.extend({
model:wines,
el:'.wineDiv',
initialize: function(){ 
var self=this;
wines.fetch();
_.each(this.model.toArray(), function(wine, i){

self.$el.append((new WineLists({ model : wine })).render().$el);

});}});

var wineListView = new WineList();


//please check ur DOM manipulation i think there is some error in ur HTML try to change call //sequence