onclick事件更新模型屬性，但視圖不呈現

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'); 
    } 
});