1

在我的view.js我称之为 wine-list-tpl（模板），如下所示，您可以看到这一点。但是索引页面没有显示任何内容。请帮忙。

在索引.html

<script type="text/template" id="wine-list-tpl">
Hello world 
<%= name %>
</script>
.......
<div class="wine-list"></div>

在 view.js

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();

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

在 WineLists 视图中，我正在获取所有这些数据。表示当我写作时，console.log(this.model.get('name')); 我得到了我想要的数据，但我只想通过模板将这些数据显示到那个特定的 div。我该怎么办，请建议。

4

2 回答 2

0

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

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()
于 2013-10-22T07:42:15.910 回答
0 
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
于 2013-10-22T10:27:21.637 回答