Backbone Marionette에서 DOM 종속 요소를 만드는 방법은 무엇입니까?

Question

내 백본 + 마리오 네트 어플리케이션에서 나는 morris.js Line Chart를 사용했습니다. 이 차트는 모델의 데이터 배열을 사용합니다. 그리고 DOM을 만든 후에 만들어야합니다 (DOM에 따라 다름).

_createChartData: function() { 
    var trends = this.model.get("trends"), 
     chartData = []; 

    $.each(trends, function (x, y) { 
     // some actions with data 
    }); 

    return chartData; 
}, 
_createChart: function() {  
    Morris.Line({ 
     element: 'promo-chart', 
     data: this._createChartData(), 
     xkey: 'date', 
     ykeys: ['y', 'g'], 
    }); 
} 

보기 및 컨트롤러 :

Сode 차트 작성하는

define(['utils/hbs', 'modules/model/promo-mdl'], function(Hbs, Promo){ 
    var PromoView = Marionette.ItemView.extend({ 
     initialize: function() { 
      this._events(); 
     }, 

     template: Hbs.tf('modules/promo'), 

     templateHelpers: { 
      // handlebars helpers 
     }, 

     events: { 
      'click #submitBtn'   : '_savePromo', 
     }, 

     _events: function() { 
      this.listenTo(this.model, 'change', this.render); 
     }, 

     _savePromo: function() { 
      // save data 
     }   
    }); 

    return Marionette.Controller.extend({ 
     initialize: function (config) { 
      this.region = config.region; 
      this.model = new Promo({}); 
      this.model.fetch(); 
      this._events(); 
     }, 

     _events: function() { 
      App.vent.on('show:promo', this._show, this); 
     }, 

     _show: function() { 
      this.view = new PromoView({ model: this.model }); 
      this.region.show(this.view); 
     } 
    }); 
}); 

내가보기에이 차트를 만들려고을하지만, 오류가있어 - 빈 데이터 또는 DOM에서 전혀 차트 요소를 . 이 차트는 뷰 또는 컨트롤러에서 어디에서 만들 수 있습니까? 그리고 어떤 이벤트를 사용할 것인가? onShow 또는 onRender를 초기화 하시겠습니까?

Answer 1

사용하는 요소가 아직 DOM에없는 경우 차트를 만드는 것처럼 보입니다. 뷰의 onShow 기능에 차트를 만들어보십시오 : 뷰에서

var PromoView = Marionette.ItemView.extend({ 

    // code... 

    onShow: function(){ 
     // create chart here 
    } 
}); 

Answer 2

onDomRefresh 기능 당신이 찾고있는 수 있습니다.