使用带有Sammy.js的单个模板(把手或小胡子)进行Rails客户端/服务器端渲染 [英] Rails Client side / Server side rendering using single template (handlebars or Mustache) with Sammy.js

问题描述

我已经在网上搜索了一段时间以寻找教程，但是运气并不好.

I've searched the web for a while looking for a tutorial, but haven't had much luck.

据我了解，Twitter正在使用Rails中的单个Mustache.js模板在首次加载页面时从服务器进行渲染，然后通过其自己的Ajax转换系统(类似于sammy.js)进行渲染.

From what I understand, Twitter is using a single Mustache.js template in rails to render from the server on first page load, and then through their own ajax transition system (much like sammy.js).

我可以将把手和sammy.js加载到rails中，但是我不知道如何从server(rails)&中共享单个模板文件.客户端(sammy).

I can get handlebars and sammy.js loaded in rails, but I can't figure out how to share a single template file from server(rails) & client(sammy) side.

推荐答案

我还没有在服务器端和客户端使用相同模板的地方构建任何东西，但这是我可以想到的一种方法这个.

I have not personally built anything where I've used the same template server-side and client-side, but here is one way that I can think to do this.

假设您有部分图片(_image.mustache):

Say you have an image partial (_image.mustache):

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

在服务器端呈现页面时，您可以将其用作常规部分并将其插值给Mustache.然后，您也可以在脚本标签中呈现它，以使用 Resig微模板方案

When you render your page server-side you can just use this as a normal partial and interpolate it for Mustache. Then you can also render it in a script tag to use a Resig micro-templating scheme.

{{{image_js_template}}}

在"Mustache"视图类中:

In your Mustache view class:

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

这应使模板不插值({{仍在文本中).现在，您只需在Javascript中按ID提取此模板即可.在ebrian.js中，您可以执行以下操作:

This should render the template uninterpolated (with the {{'s still in the text). Now you can just pick up this template in your Javascript by it's id. In backbone.js you could do something like:

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

我还没有使用过Sammy.js，但似乎它希望所有模板都可以公开使用，这可能会引起问题.但是，您仍然可以使用上述技术，并直接传递render()和partial()jQuery对象(如所示这里).

I've not used Sammy.js but it appears that it expects all of it's templates to be publicly available, which could present an issue. However, you can still use the technique above and pass render() and partial() jQuery objects directly (as indicated here).

这是基本思想，但您可能需要做很多事情才能使这一过程变得更加无缝.我会检出有关使用模板的Jammit部分，特别是有关使用Mustache的部分.另外， ICanHaz.js 具有简化客户端小胡子模板使用的方式.

This is the basic idea, but there is probably a lot you could do to make this more seamless. I would checkout the Jammit section on using templates, specifically the part about using Mustache. Also ICanHaz.js has a way of simplifying the use of client side Mustache templates.

这篇关于使用带有Sammy.js的单个模板(把手或小胡子)进行Rails客户端/服务器端渲染的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！