2011-03-29 18 views
4

我在網上搜索了一段時間尋找教程,但沒有多少運氣。Rails客戶端/服務器端渲染使用Sammy.js使用單個模板(把手或小鬍子)

據我所知,Twitter使用rails中的單個Mustache.js模板在服務器首頁加載時,然後通過自己的ajax過渡系統(非常像sammy.js)進行渲染。

我可以在rails中加載handlebars和sammy.js,但我無法弄清楚如何從服務器(rails)& client(sammy)端共享一個模板文件。

回答

4

我還沒有親自構建過任何使用相同模板服務器端和客戶端的任何東西,但這裏有一種方法可以實現。

假設你有一個形象的部分(_image.mustache):

<div class="image"> 
    <a href="{{ view_url }}"> 
    <img height="{{ height }}" width="{{ width }}" src="{{ src }}" /> 
    </a> 
</div> 

當你渲染你的頁面的服務器端你可以使用它作爲一個正常的部分和插它的鬍子。然後,您還可以將其呈現在腳本標記中以使用Resig micro-templating scheme

{{{image_js_template}}} 

在你的鬍子視圖類:

def image_js_template 
    content_tag :script, :type => "template", :id => "image-template" do 
    render :text => self.partial('image') 
    end 
end 

這應該呈現uninterpolated模板(與{'仍然在文本{)。現在你可以通過它的id在Javascript中選擇這個模板。在Backbone.js的,你可以這樣做:

class Views.AllImageList extends Backbone.View 
    initialize: (options) -> 
    @template = $('#image-template').html() 

我沒有用Sammy.js但現在看來,它預計它的所有模板是公開的,這可能存在的問題。但是,您仍然可以使用上面的技巧並直接傳遞render()和partial()jQuery對象(如here所示)。

這是基本的想法,但可能有很多你可以做,使這更加無縫。我會結賬the Jammit section on using templates,特別是關於使用鬍子的部分。另外ICanHaz.js有一種簡化客戶端鬍子模板使用的方法。

相關問題