骨幹：綁定事件發生多次

Question

我做一個簡單的待辦事項應用：

var Todo = Backbone.Model.extend({ 

}); 

var Todos = Backbone.Collection.extend({ 
    model: Todo 
}); 

var todos = new Todos(); 

var ItemView = Backbone.View.extend({ 
    tagName: "li", 
    template: _.template($("#item-template").html()), 
    render: function() { 
     this.$el.html(this.template(this.model.toJSON())); 
     return this; 
    }, 
    initialize: function() { 
     this.listenTo(todos, 'remove', this.remove); 
    }, 
    events: { 
     "click .delete": "clear" 
    }, 
    clear: function() { 
     todos.remove(this.model); 
    } 
}); 

var AppView = Backbone.View.extend({ 
    el: $("body"), 
    initialize: function() { 
     this.listenTo(todos, 'add', this.addOne); 
    }, 
    addOne: function(todo) { 
     var view = new ItemView({ 
      model: todo 
     }); 
     this.$("#list").append(view.render().el); 
    },  
    events: { 
     "click #create": "create" 
    }, 
    create: function() { 
     var model = new Todo({ 
      title: this.$("#input").val() 
     }); 
     todos.add(model); 
    } 
}) 

var app = new AppView(); 

和在線演示是在這裏：http://jsfiddle.net/JPL94/1/

我可以正確添加項目，但是當我想刪除一些項目，全部他們被刪除;

我發現它與ItemView中的綁定事件有關，當我點擊一個delete按鈕時，所有這些按鈕都被觸發。

但我該如何解決這個問題？

Answer 1

您正在傾聽從集合中刪除事件，如果我的記憶爲我服務，則每當刪除模型時集合都會分派remove事件，因此，當您從集合中刪除模型時，所有視圖都將看到事件。

我改變你的初始化的視圖中的

initialize: function() { 
    this.listenTo(this.model, 'remove', this.remove); 
}, 

它似乎工作。

http://jsfiddle.net/JPL94/5/