Question

在我的骨干中，我为每个模型制作了一个onclick事件，以更新名称..这很好用。我也在视图中获得更新模型视图的触发器。

但是视图没有更新模型..而且html中的文本根本没有变化..

我的模型视图：

var studentView = Backbone.View.extend({
    tagName:'li',
    events:{
        'click':"called"
    },
    template:_.template($("#studentTemplate").html()),
    render:function(){
        this.$el.append(this.template(this.model.toJSON()));
        this.model.get('scored') > 60 ? this.$el.addClass("active") : null;
        return this;
    },
    called:function(){
        this.model.set('name','text'); // i am setting a name as 'text' for example
    }
});

我的渲染视图：

var studentsView = Backbone.View.extend({
el:$(".page"),
events:{
    "click #highScoreBtn":"showHighScore"
},
initialize:function(){
    this.collection = new collection(student);
    this.render();
    this.collection.on('change', this.renderOne,this);
},
render:function(){
    var that = this;
    _.each(this.collection.models, function(item){
        that.$el.find('ul').append(new studentView({model:item}).render().el);
    })

},
renderOne:function(data){
    this.$el.find('ul').append(new studentView({model:data}).render().el); // appending as new element instead updating the existing one..
}

}）

所以，我的代码有什么问题..或者在我的jsfiddle中有任何人纠正我...

here is my jsfiddle link

提前致谢..

Answer 1

这对我有用：

var studentView = Backbone.View.extend({
    tagName:'li',
    events:{
        'click':"called"
    },
    template:_.template($("#studentTemplate").html()),
    initialize:function(){
        this.listenTo(this.model, 'change', this.render);
    },
    render:function(){
        this.$el.html(this.template(this.model.toJSON()));
        this.model.get('scored') > 60 ? this.$el.addClass("active") : null;
        return this;
    },
    called:function(){
        this.model.set('name','text');
    }
});

onclick事件更新模型属性但视图不呈现

1 个答案: