從列表寬度更新項目Backbone.js

我已經開始使用Backbone.js，並且我有更新html元素的問題。這是我的代碼：從列表寬度更新項目Backbone.js

路由器：

App.Routers.Test = Backbone.Router.extend({ 

    routes: { 
     "/start" :  "start", 
     "/modify" :  "modify" 
    }, 

    start: function() { 

     this.List = new App.Collections.Test; 
     this.ViewList = new App.Views.Test({model: this.List}); 

     this.List.fetch(); 

    }, 

    modify: function() { 
     var model = this.List.get(1); 
     model.set({name: 'Item modified'}); 
     alert('Modified!'); 
    } 

});

瀏覽：

App.Views.Item = Backbone.View.extend({ 

    inizialize: function() { 
     this.model.bind('change:name',this.render); 
    }, 

    render: function() { 
     $('#tmpl').tmpl(this.model.attributes).appendTo(this.el); // jQuery Template 
     return this; 
    } 

}); 

App.Views.Test = Backbone.View.extend({ 

    el: '#list', 

    initialize: function() {        
     _.bindAll(this, 'render');   
     this.model.bind('reset', this.render);   
    }, 

    render: function() { 
     $(this.el).empty(); 
     this.model.each(function(model) { 
      var viewItem = new App.Views.Item({model: model}); 
      $('#list').append((viewItem.render().el)); 
     });  
    } 



});

當我去「＃/修改」的模式已經改變，但這不更新HTML視圖，雖然我已經在項目中添加了這個代碼：

this.model.bind('change:name',this.render);

也許我不明白正確骨幹的功能，如何表現？

PS：因爲我是骨幹人員，所以接受任何建議。

來源

2011-08-11 keepyourweb

在您的modify方法中，調用相應的視圖。我通常會通過model和el的實例。因此，舉例來說：

this.modifyPage = new App.Views.Test({ 
    el: $('#list'), 
    model: model 
});

不過，如果你不需要el作爲上下文從路由器，這是最好的使用jQuery的限制只的意見。

來源

2011-08-11 12:51:42 wanovak

從列表寬度更新項目Backbone.js

回答

相關問題