Backbone.js でアプリケーションを開発しています。ボタンがあり、それを押すと、コンテンツのモジュール (ビューとモデル) が追加されます。他のボタンを押すと、コンテンツが削除されます (ビューとモデル)。追加ボタンを連打すると内容のビューが表示されて書き換えられるのですが、以前のモデルは削除されません。追加する同じボタンが複数回押された場合、コンテンツ モデルを削除するにはどうすればよいですか?
var tabsContents = Backbone.View.extend({
el: "body",
events: {
"click .addAll": "addContentAll"
},
initialize: function() {
_.bindAll(this);
this.model = new ContentCollection();
this.model.on("add", this.contentAdded);
this.model.on("remove", this.contentRemoved);
},
addContentAll: function(event) {
this.model.add({name: "all"});
contentAdded: function(content) {
if (content.view == null) {
var template_name;
switch(content.get("name")){
case 'all': template_name = 'home'; break;
}
content.view = new ContentView({model: content,template: $.trim($("[data-template-name='"+ template_name +"'] div").html() || "Template not found!")});
$(".box2").empty(); this.$el.find(".content").find("div.box").append(content.view.render().el);
}
},
contentRemoved: function(content) {
if (content.view != null) {
content.view.remove();
}
content.clear(); //Clear the properties of the model
}
});
var ContentView = Backbone.View.extend({
tagName: "div",
template: null,
events: {
"click .Close": "removeView"
},
initialize: function() {
_.bindAll(this);
this.template = this.options.template;
},
render: function() {
this.$el.html(Mustache.render(this.template, this.model.toJSON()));
return this;
},
removeView: function() {
this.model.collection.remove(this.model); //Remove the model of the coll
}
});
var tabsview = new tabsContents();
ボタンをクリックして別のモデルを追加するモデルを削除する方法もわかりません