我一直在學習很多關於骨幹，骨幹關係和通過stackexchange構建web應用的建議 - 所以首先感謝社區。View +骨幹/骨幹關係應用中的子視圖
現在，我堅持試圖理解這個當前涉及嵌套模型和子視圖的問題，在我看來是一個非常常見的用例。
我試圖擴展這個tutorial，通過keepin跟蹤每個葡萄酒的「CheckIns」來了解骨幹關係，視圖/子視圖和事件處理。
我已經擴展了服務器端返回的簽入適當的JSON和骨幹關係模型，如下所示：
window.CheckInModel = Backbone.RelationalModel.extend({
defaults:{
"_id":null,
"Did":"true",
"dateOf":"",
}
});
window.CheckInCollection = Backbone.Collection.extend({
model : CheckInModel
});
，酒型號，像這樣：
relations: [{
type: Backbone.HasMany,
key:'CheckIn',
relatedModel: 'CheckInModel',
collectionType: CheckInCollection,
}]
我已經創建了一個CheckInListView和CheckInItemView（與WineListView和WineListItemView相同），並使用WineView Render函數渲染CheckIns，如下所示：
render:function (eventName) {
console.log("wine View Render");
$(this.el).html(this.template(this.model.toJSON()));
this.myCheckInListView = new CheckInListView({model: this.model.attributes.CheckIn});
this.$el.append(this.myCheckInListView.render().el);
return this;
},
我還創建簽入wineview內創建一個新的功能，並與給定事件關聯：
logcheckin: function (event){
var todate = new Date();
newCheckIn = new CheckInModel ({'Did':"true", 'dateOf': todate.toISOString()});
console.log ("Logcheckin - About to push newCheckIn onto Model.");
this.model.attributes.CheckIn.push (newCheckIn);
console.log ("Just pushed newCheckIn onto Model.");
this.saveWine();
}
好 - 如果你還沒有TL/DRED尚未 - 這一切似乎從用戶界面的角度來看工作很好-ie。一切正確呈現並保存到Db。
但我注意到在控制檯中，當我推入一個新的CheckIn（在上面的console.logs之間）時，CheckInListView的Add綁定會被多次調用，用於wach按鈕按下 - 這讓我覺得我的一些錯誤做觀點或者我不瞭解事件傳播的基本原理。
這是怎麼發生的？它預期的行爲？我正在接近我想要做的事嗎？
感謝您閱讀，如果不是你的幫助。
==
下面是綁定到add（及其他）事件CheckinListView和CheckInList項目意見的相關部分。
window.CheckInListView = Backbone.View.extend({
initialize:function() {
this.model.bind("reset", this.render, this);
this.model.bind("change", this.render, this);
var self = this;
this.model.bind("add", function (CheckIn) {
console.log ("Adding to CheckInListView - a CheckIn List Item", CheckIn);
self.$el.append(new CheckInListItemView({model:CheckIn}).render().el);
});
},
close:function() {
$(this.el).unbind();
$(this.el).remove();
}
});
window.CheckInListItemView = Backbone.View.extend({
initialize:function() {
this.model.bind("change", this.render, this);
this.model.bind("destroy", this.close, this);
},
});
=========================================== ===
關於事件綁定和關閉視圖的評論是調試這個的正確提示。
1）我沒有關閉，並留下一些鬼事件消費者即使有沒有在DOM
2妥善解除綁定嵌套視圖），你只需要綁定事件，如果我們想要做的事只有在子視圖。
例如 - 如果我有子視圖中的複選框，我可以在主視圖中綁定子視圖更改事件並處理那裏的事件，因爲主視圖有模型。我不知道這是否是「正確」的方式，但它適用於我需要做的事情。 （毫米..意大利麪條代碼味道很好）
3）在這方面掙扎着幫助我更多地思考UX，並幫助我簡化UI。
4）我試圖通過將所有數據嵌套到JSON調用中來「保存」對服務器的調用。如果我要重新執行此操作 - 我根本不會嵌套數據，而是在後端處理它，方法是將wine ID與checkIn ID相關聯，然後在選擇任務後擁有一個單獨的集合，並將集合填充到集合中 - 我認爲這不是首選的方式，但它似乎是很多人的方式。
仍然歡迎高於或「正確」的方式問題的任何想法，如果任何人都可以指向超越「簡單骨幹應用」
當你說'CheckInListView的添加綁定'時，你綁定了什麼實際事件？ –