한 컬렉션 모델을 추가하는 일반적인 구조는 내가 지금 가지고 있습니다 :백본 : 여기에 또 다른
컬렉션 'A'
이 모델을 추가하는 전망을 'A'를, 모달를 열 수 있습니다 목록에서 선택하십시오. 모달은 자신의 견해이며, 'B'는 자체 컬렉션 'B'에 묶여 있습니다. 뷰 'B'는 클릭 이벤트에서 뷰 'A'로부터 인스턴스화됩니다. (this.myParent.collection.add :
는 I는 모델 컬렉션 (B)로부터 선택되고, 그래서 "myParent '속성으로도'B '를 초기화려고, 난 뷰 B 내에서이 말을 할 신형).
나는 이것이 작동 할 것이라는 것을 알고있다, 그러나 이것 일 필요가없는 너무 단단한 연결이다? 이것에 대한 좋은 패턴이 있습니까? 몇 가지 다른 이벤트와 트리거가 여러 장소에 퍼져 있다고 생각하고 있었지만 많은 부가가치없이 복잡한 작업을 수행하는 것처럼 보입니다.
표에서 선택 가능한 모델 모음을 나열하는 응용 프로그램에서 비슷한 문제가 발생했습니다. 선택한 모델에 따라 다른보기는 사용자에게 표시 할 단추를 결정해야합니다.
이 경우에는 이벤트 중심 접근 방식을 사용했습니다. 보기 A로부터 모델이 선택 될 때마다, 내가보기 B가 듣고 상황에 컬렉션 B.
에 그 모델을 추가 이벤트를 발생, 즉,이 같은 것을 볼 수 있었다 :
// Your collection view.
var ViewA = Backbone.View.extend({
initialize: function(){
Backbone.Events.on('modelSelected', this.onModelSelected, this);
this.listenTo(this.collection, 'add', this.renderList);
},
onModelSelected: function(model){
this.collection.add(model);
}
renderList: function(){
// Draw your collection
}
// Do some clean up of events
remove: function(){
Backbone.Events.off('modelSelected', this.onModelSelected, this);
Backbone.View.prototype.remove.call(this);
}
});
// Modal View
var ViewB = Backbone.View.extend({
initialize: function(){
this.collection = new YourCollection();
this.listenTo(this.collection, 'sync', this.renderCollection);
this.collection.fetch();
},
render: function(){
// Render your modal
return this;
},
renderCollection: function(){
// Render your collection
},
//
modalSubmit: function(){
var model = this.getSelectedModel();
Backbone.Events.trigger('modelSelected', modal);
this.close();
}
});몇 가지주의 사항이 있습니다. 첫째, 강력한 네임 스페이스 이벤트 명명 스키마를 선택하는 것이 좋습니다. 이것은 단지 예일뿐입니다. 둘째, 초기화 함수에서 가져 오는 것이 이상적이지는 않지만 간결함을 위해 컨트롤러 개념을 빠뜨리고 있습니다.