For this chapter we will use Mote, a very simple and powerful template engine.
Pour ce chapitre nous allons utiliser Mote, un moteur de templates très simple et puissant.
Save this template to "./views/index.mote"
:
Sauvegardez ce template à "./views/index.mote"
:
<!DOCTYPE html>
<html>
<head>
<title>{{title}}</title>
</head>
<body>
{{content}}
</body>
</html>
Now let's create a custom Deck with methods for rendering the template.
Maintenant, créez un Deck personnalisé avec des méthodes pour le rendu de templates.
require "syro" require "mote" class Web < Syro::Deck include Mote::Helpers def view(template) sprintf("views/%s.mote", template) end def render(template, options = {}) res.html mote(view(template), options) end end App = Syro.new(Web) do get do render("index", title: "foo", content: "bar") end end env = { "REQUEST_METHOD" => "GET", "PATH_INFO" => "/", } p App.call(env)
Output:
Résultat :
[200, {"Content-Length"=>"100", "Content-Type"=>"text/html"}, ["<!DOCTYPE html>..."]]
Most of the body was omitted in the example, but you should be able to see how the variables in the template got the right values.
La plupart du corps a été omise dans l'exemple, mais vous devriez être capable de voir comment les variables dans le template ont reçu les bonnes valeurs.
Rename index.mote
to layout.mote
, and
create the file index.mote
with the following content:
Renommez index.mote
par layout.mote
, et
créez le fichier index.mote
avec le contenu suivant :
<h1>{{title}}</h1>
<p>{{content}}</p>
We can now modify our Deck to include layouts and partials.
Nous pouvons modifier notre Deck pour inclure des layouts et des partiels.
require "syro" require "mote" class Web < Syro::Deck include Mote::Helpers def view(template) sprintf("views/%s.mote", template) end def partial(template, params = {}) mote(view(template), params) end def render(template, params = {}) res.html partial("layout", title: params[:title], content: partial(template, params)) end end App = Syro.new(Web) do get do render("index", title: "foo", content: "bar") end end env = { "REQUEST_METHOD" => "GET", "PATH_INFO" => "/", } p App.call(env)
Output:
Résultat :
[200, {"Content-Length"=>"124", "Content-Type"=>"text/html"}, ["<!DOCTYPE html>..."]]
Again, most of the body was ommited in the output, but you should be able to see how the template was inserted in the layout, and all the variables were replaced with the supplied values.
Encore une fois, la plupart du corps a été omise, mais vous devriez être capable de voir comment le modèle a été inséré dans le layout, et toutes les variables ont été remplacées par les valeurs données.