2013-08-02 2 views
8

CompositeView가 정의 된 itemView로 데이터를 전달할 수 있는지 궁금합니다. 보기 (축소) 코드 :Backbone.Marionette : CompositeView를 통해 itemView로 데이터를 전달 하시겠습니까?

var TableView = Backbone.Marionette.CompositeView.extend({ 
    template: '#table-template', 
    itemView: TableRowView, 
    itemViewContainer: 'tbody', 
}); 

var TableRowView = Backbone.Marionette.ItemView.extend({ 
    tagName: 'tr', 
    template: '#table-row-template', 
    serializeData: function() { 
     var data = { 
      model: this.model, 
      // FIXME This should really only be called once. Pass into TableView, and down into TableRowView? 
      // That way, getDisplayColumns can be moved to the collection as well, where it makes more sense for it to belong. 
      columns: this.model.getDisplayColumns() 
     }; 
     return data; 
    } 
}); 

두 가지를 사용하여 HTML 표를 렌더링합니다. # table-row-template에는 여러 유형의 "열"을 지원하는 일부 렌더링 논리가 있습니다. 이를 통해 다양한 유형의 컬렉션/모델 (API를 따르는 한)에서 동일한보기를 사용할 수 있습니다. 지금까지 꽤 잘 작동했습니다!

위에서 볼 수 있듯이, 각 "행"은 매번 같은 "열"데이터를 가져 오기 위해 전화를 걸었습니다. 실제로 그 데이터를 한 번만 전달하고 모두를 사용하고 싶었습니다.

권장 사항?

감사합니다.

답변

13

당신과 함께 두 객체 나 함수로

var TableView = Backbone.Marionette.CompositeView.extend({ 
    template: '#table-template', 
    itemView: TableRowView, 
    itemViewContainer: 'tbody', 
    itemViewOptions: { 
     columns: SOMEOBJECTORVALUE 
    } 
}); 

또는

var TableView = Backbone.Marionette.CompositeView.extend({ 
    template: '#table-template', 
    itemView: TableRowView, 
    itemViewContainer: 'tbody', 
    itemViewOptions: function(model,index){ 
     return{ 
      columns: SOMEOBJECTORVALUE 
     } 
    } 
}); 

후받을 수있는 옵션을 itemViewOptions을 사용할 수 있습니다 *

var TableRowView = Backbone.Marionette.ItemView.extend({ 
    tagName: 'tr', 
    template: '#table-row-template', 
    initialize: function(options){ 
     this.columns = options.columns; 
    } 
}); 

(즉 itemView, itemV iewContaineritemViewOptions는 childView, childViewContainer 및 childViewOptions)를 버전 2로 변경된다.

+1

감사합니다. 많은 감사합니다. 문서 도구는 업데이트로 수행 할 수 있습니다. – starmonkey

+4

n.b. Marionette v2가'item *'을'child *'로 바꾸었다. – alxndr

관련 문제