blob: 11e7aa6e0e6193aad876e633d4c8892a1a31535b (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
|
<!DOCTYPE html>
<html lang="en">
<head>
<title>Handlebars 中文网:轻逻辑语义化的模板引擎</title>
<meta charset="UTF-8">
<link href="static/stylesheets/application.css" media="all" rel="stylesheet" type="text/css"/>
<link href="static/stylesheets/sunburst.css" media="all" rel="stylesheet" type="text/css"/>
<link href="static/stylesheets/site.css" media="all" rel="stylesheet" type="text/css"/>
<link href="static/images/favicon.png" rel="shortcut icon" type="image/png" />
</head>
<body>
<div id="body">
<div id="header">
<a href="index.html">
<img alt="Handlebars 中文网:轻逻辑语义化的模板引擎" src="static/images/handlebars_logo.png"/>
</a>
</div>
<div id="contents">
<a href="http://www.devswag.com/collections/handlebars" id="callout">
<img alt="Buy Handlebars swag on DevSwag!" src="static/images/handlebars-devswag.png"/>
</a>
<div id="intro">
<p>传入数据,执行 Handlebars 返回 渲染后的 HTML。</p>
<pre><code class="lang-html"><span class="hljs-keyword">var</span> source = $(<span class="hljs-string">"#entry-template"</span>).html();
<span class="hljs-keyword">var</span> <span class="hljs-keyword">template</span> = <span class="hljs-type">Handlebars</span>.compile(source);
<span class="hljs-keyword">var</span> context = {title: <span class="hljs-string">"My New Post"</span>, body: <span class="hljs-string">"This is my first post!"</span>}
<span class="hljs-keyword">var</span> html = <span class="hljs-keyword">template</span>(context);
</code></pre>
<p>渲染结果</p>
<pre><code class="lang-html"><<span class="hljs-keyword">div</span> <span class="hljs-type">class</span>=<span class="hljs-string">"entry"</span>>
<h1>My New Post</h1>
<<span class="hljs-keyword">div</span> <span class="hljs-type">class</span>=<span class="hljs-string">"body"</span>>
This <span class="hljs-keyword">is</span> <span class="hljs-keyword">my</span> <span class="hljs-keyword">first</span> post!
</<span class="hljs-keyword">div</span>>
</<span class="hljs-keyword">div</span>>
</code></pre>
<p><a href="demo/execution-1.html" target="_blank">示例</a></p>
</div>
<h2>选项</h2>
<p>这里的 <code>template()</code> 允许传入第二个参数作为选项 </p>
<p>The template function can be passed an options object as the second parameter which allows for customization:</p>
<ul>
<li><code>data</code> Pass in an object to define custom <code>@variable</code> private variables.</li>
<li><code>helpers</code> Pass in to provide custom helpers in addition to the globally defined helpers.
Values defined in this object will replace any values defined in the global object for the duration of the template execution.</li>
<li><code>partials</code> Pass in to provide custom partials in addition to the globally defined partials.
Values defined in this object will replace any values defined in the global object for the duration of the template execution.</li>
</ul>
<!-- End .contents-->
<a class="issue-tracker" href="https://github.com/nimojs/handlebarsjs.org/issues">
发现翻译错误?告诉我们。
</a>
</div>
</div>
<div id="credits"></div>
<a href="http://github.com/nimojs/handlebarsjs.org/" id="github">
<img alt="Fork me on GitHub" src="static/images/forkme_right_darkblue_121621.png" />
</a>
</body>
</html>
|