Backbone.Marionette模板異步加載

我們爲我們的項目使用Backbone和Backbone.Marionette。我們目前在服務器上存儲了我們視圖的所有模板，並且我們覆蓋了loadTemplate調用以異步加載它們。Backbone.Marionette模板異步加載

但是，當我們使用佈局視圖時，由於視圖的模板是異步加載的，因此我們似乎無法立即訪問佈局的區域。以下是一個例子：

var layoutView = new Layout(); 
var itemView = new ItemView(); 

App.containerRegion.show(layoutView); 
layoutView.mainRegion.show(itemView); <---- This is where the issue would occur.

如果我們不從服務器異步加載模板，那麼它會正常工作。什麼是實施這個的好方法？我們希望在服務器上保留模板，而不是一次加載所有內容。我們也希望避免在我們的代碼中綁定到佈局視圖的渲染事件。

感謝

來源

2012-09-23 user1691932

我認爲你必須重寫Marionette.ItemView的渲染功能，你首先加載模板數據和渲染視圖上成功加載模板：

render: function(){   
    if (this.beforeRender){ this.beforeRender(); } 

    this.trigger("before:render", this); 
    this.trigger("item:before:render", this); 

    var data = this.serializeData(); 
    var templateSrc = this.getTemplate(); 

    $.ajax({ 
     url: 'templatesFolder/' + templateSrc, 
     success: _bind(function(template){ 
     var html = Marionette.Renderer.render(template, data); 
     this.$el.html(html); 

     if (this.onRender){ this.onRender(); } 
     this.trigger("render", this); 
     this.trigger("item:rendered", this); 
     }, this) 
    }) 

    return this; 
    },

來源

2012-09-23 11:51:54

您需要抓住Marionette.Async插件。它是爲了完成你想要的。

但是，您需要知道，從服務器異步獲取模板會帶來性能影響。這樣做的網絡延遲會導致用戶認爲應用程序沒有響應，如果屏幕上沒有任何東西告訴他們該應用程序在幕後工作（如微調圖形）。

最好一次抓取儘可能多的模板，以減少網絡延遲和傳輸。有這樣做a blog post that a friend of my wrote。

來源

2012-09-26 02:46:53

Backbone.Marionette模板異步加載

回答

相關問題