本文涵盖以下主题:

介绍

调用帮助中心中的模板语言Curlybars并实现了Handlebars语言的一个大子集。本指南向您展示如何使用该语言自定义帮助中心中的页面。

帮助中心为您提供帮助程序和命名属性来定制您的内容。有些是在所有帮助中心页面上共享和可用的。其余的是特定于页面的。

例子

{{#each comments}} 
 
  
 
 
  {{author.name}}  
 
 
 {{/each}}

该示例生成在页面上留下评论的用户列表。的每一个Helper遍历页面中的每个值评论财产。的值对于每个注释author.avatar_url和author.name属性插入到HTML中。

Curlybars模板由两部分组成:按原样呈现的逐字文本和Curlybars表达式。这意味着空模板也是有效模板，而只包含文本的模板也是有效模板。例如，下面是一个有效的模板:

文章
 
文章的一些细节

当然，如果帮助中心模板只支持逐字文本，则无法在呈现时真正定制它们。要添加模板逻辑，需要用双花括号({{和｝｝）.

要在前面的例子中添加模板逻辑，你可以这样修改模板:

文章
 
文章的一些细节
 {{Article .author.name}}

下面几节解释如何编写有效的表达式来对模板进行有意义的更改。

请注意，在另一对曲线中嵌套一对曲线是无效的语法。例如，以下内容是不允许的:

文章
 
文章的一些细节
{{{{…}}}}

评论

在某些情况下，在模板中添加一些不会泄漏到呈现页面中的注释可能会派上用场。为此，Curlybars允许在打开的Curlybars后面加上感叹号，而不需要任何空格。{{!…｝｝。您可以使用此语法在示例中添加代码注释:

{{!这个模板的目的是显示一篇文章的细节}}
 article 
文章的一些细节

下面是渲染页面后发送给浏览器的内容:

文章
 
文章的一些细节

在开发模板时，这种在注释中丢弃任何内容的效果实际上会派上用场。您可能希望注释掉一些代码，以便进行一些检查、调试等。

块注释

不幸的是，到目前为止描述的注释语法不适合注释Curlybars代码。要注释掉Curlybars代码，请使用以下语法:{{!——……——}}。这种注释可以跨越几行，并有效地注释掉代码。例子:

{{!这个模板的目的是显示一篇文章的细节}}
 article 
文章的一些细节
 {{!——我想推荐下面的代码:{{…一些Curlybars表达式}}——}}

上面的模板呈现如下:

文章
 
文章的一些细节

文字

要包含您希望Curlybars在编写时准确解释的值，Curlybars支持文字。字面量可以表示3种类型的值字符串,一个布尔，或者数量。

要表示字符串，可以同时使用单引号和双引号，但不能混合使用。例如,'这是一个有效的字符串'，"这也是有效的",但"这是无效的"。

数字可以是任何正整数或负整数。123是一个有效的正数，+ 123表示相同的值，00123仍然有效，并且-123年也是有效的。

布尔值表示为真正的和假。不允许有其他变化。例如,真正的和假在Curlybars中不会被解释为布尔值。

您可以呈现字面量。例子:

一个字符串:{{'hello world'}}一个布尔值:{{true}}一个数字:{{42}}

页面呈现如下:

字符串:'hello world'，布尔值:true，数字:42

属性

使用点符号从这些对象中获取特定的信息。一个简单的例子是article.title。

属性的完全限定名有时称为路径。例如,名字属性是否在作者对象,但是article.author.name是它的路径。

可以通过将属性的值括在双花括号内来显示它。回到这个例子，你可能想在一个单独的段落中打印出作者的名字:

<标题>文章< / h1 > < p >作者:{{article.author.name}} < / p >

假设一个用户想看一篇由一个名叫John Venturini的代理人写的文章。模板将呈现如下:

文章
 
作者:John Venturini

您可能还想呈现文章本身。的文章对象有身体属性，该属性包含项目的内容。您将按照如下方式修改模板以呈现文章的主体:

文章
 
作者:{{Article . Author .name}}
 < Article >{{Article .body}}

条件

除了呈现属性值之外，模板语言还允许您向模板添加条件呈现逻辑。

例如，如果所请求的文章是内部的，您可能希望呈现HTML片段。文章页面上下文有一个article.internal返回的属性真正的如果文章是内部的和假否则。

您可以创建一个如果用这些信息阻塞。的如果表达式必须指定为真或假的条件。结果决定是否呈现块中的内容。下面是基本语法:

{{#if condition}}如果条件为真，则渲染。{{/如果}}

示例模板的修改方法如下:

Article
 {{#if Article .internal}} 
这篇文章是内部的。< / p >{{/如果}}
Author: {{article.author.name}}
 
{{article.body}}

当条件为false时，您可能想要渲染一个块。在这种情况下，使用an除非块。语法类似于如果布洛克:

{{#unless condition}}如果条件为false，则呈现此选项。{{/除非}}

回到示例中，假设您还希望在文章不是内部的情况下呈现消息。模板修改方法如下:

Article
 {{#if Article .internal}} 
这篇文章是内部的。< / p >{{/如果}}{{#unless article.internal}} 
This is a publicly visible article!
 {{/unless}} 
Author: {{article.author.name}}
 
{{article.body}}

这种条件逻辑——“如果为真，执行此操作，否则执行此操作”——通常由一个if - else块。语法如下:

{{#if condition}}如果条件为真，则渲染。{{else}}如果条件为false，则呈现此选项。{{/如果}}

您可以将示例修改如下:

Article
 {{#if Article .internal}} 
这篇文章是内部的。
 {{else}} 
这是一篇公开可见的文章!< / p >{{/如果}}
Author: {{article.author.name}}
 
{{article.body}}

的除非Block也有一个unless-else变体。您可以使用它来获得与if - else布洛克:

Article
{{#除非Article .internal}} 
这是一篇公开可见的文章!
 {{else}} 
这篇文章是内部的。< / p >{{/除非}}< p >作者:{{article.author.name}} < / p > <文> {{article.body}} < / >的文章

如何评估条件

条件通常是帮助中心属性，例如article.internal，其布尔值为真正的或假。有些属性没有布尔值。这些属性的评估如下:

• 如果值是一个数字，那么0为假，其他任何数字为真

• 如果值是字符串，则空字符串为假，其他字符串为真

• 如果值是对象的集合，则空集合为false，其他集合为true

• 如果该值为空，则表达式为false

假设您想要设置一些检查数字的条件逻辑。文章页有一个article.comment_count属性，该属性包含文章中的评论总数。你可以使用如果条件，以测试计数是否为非0并显示一些令人愉快的信息。例子:

文章
 
作者:{{Article . Author .name}}
 < Article >{{Article .body}}{{#if article.comment_count}} 
Yahoo! This article has got some comments!
 {{/if}}

清理空白区域

当Curlybars处理模板时，它会按原样显示任何逐字文本。这很好，大多数情况下都很有效。然而，有时您需要对表达式旁边的空白字符有更多的控制。以下面的代码为例:

< a href = "//www.ying8.net/support/hc/en-us/articles/…" class = "{{#如果强调}}突出{{/如果}}" >点击我!< / >

时，它将呈现以下HTML突出显示是正确的:

例如，您可以使用名为摘录在文章页面模板中截断字符串。在文章示例中，假设需要显示文章标题的删节版本。你可以这样修改模板:

<标题>{{摘录的文章。 
作者:{{article. Author .name}}
 
{{article.body}}

调用帮助器的语法是{{ […][…]}}。唯一必需的元素是帮助器的名称。参数和选项因帮助器而异。

现在，假设您希望更新模板，以便在作者的名字是John Venturini时显示一条愉快的消息。不幸的是，你不能使用an如果检查是否的条件article.author.name等于“约翰Venturini”因为如果只对一个表达式有效。比较运算符= =是不可用的。

那么如何添加这样的逻辑呢?幸运的是，您可以使用是帮手。它接受两个参数并测试它们是否相等。例子:

<标题>{{摘录的文章。标题字符=50}} {{#is article.author.name 'John Venturini'}} 
酷!John Venturini是这篇文章的作者!
 {{/is}} 
{{article.body}}

如果作者是约翰·文图里尼，上面的代码片段将呈现令人愉快的信息。但如果不是他，你想传达不同的信息呢?好消息是是也可以包括其他的就像if - else声明。如果作者不是John Venturini，要恢复旧消息，可以添加其他的分块如下:

<标题>{{摘录的文章。标题字符=50}} {{#is article.author.name 'John Venturini'}} 
酷!John Venturini是这篇文章的作者!< / p >{{其他}}< p >作者:{{article.author.name}} < / p >{{/}} <文> {{article.body}} < / >的文章

变化的范围

使用点表示法访问数据非常简单，特别是当我们需要的信息路径不太长时。例子:article.title。但是，在某些情况下，您可能希望访问具有较长路径的属性。例子:article.author.name。如果需要，可以在模板中使用更长的路径。例如，您可以在示例中添加作者的姓名和avator，如下所示:

<标题>{{摘录的文章。标题字符=50}}  {{#is article.author.name 'John Venturini'}} 
酷!John Venturini是这篇文章的作者!< / p >{{其他}}< p >作者:{{article.author.name}} < / p >{{/}} <文> {{article.body}} < / >的文章

上面的代码片段工作得很好，但是长属性路径使代码看起来有点混乱。解决这个问题的一种方法是使用special与构造。与接受一个参数，该参数表示要在与其关联的代码块中使用的基本上下文。语法如下:

{{#with }}…{{和}}

您可以对示例进行如下改进:

<标题>{{摘录的文章。标题字符=50}} {{#with article。作者｝｝ {{#is name 'John Venturini'}} 
Cool! John Venturini is the author of this article!
 {{else}} 
Author: {{name}}
 {{/is}} {{/with}} 
{{article.body}}

的article.author参数消除了包含的需要article.author在块中的任何路径上。所以{{名称}}在块内部相当于article.author.name在街区外。

你不能用article.author.name在数据块中，因为它会被计算为article.author.article.author.name。同样，您也无法访问块中的文章标题article.title因为文章对象只能在根上下文中访问，而根上下文中位于块的外部。

设置的上下文与并访问外部上下文，使用. . /路径中的符号。控件中呈现文章的标题与分块如下:

<标题>{{摘录的文章。标题字符=50}} {{#with article。作者}}{{. . /文章。title}}  {{#is name 'John Venturini'}} 
酷!John Venturini是这篇文章的作者!< / p >{{其他}}< p >作者:{{名称}}< / p >{{/}}{{和}}<文> {{article.body}} < / >的文章

你可以使用. . /在相同的路径上重复标记。它会跳回相同数量的上下文。例如，以下示例仍将按预期工作:

<标题>{{摘录的文章。标题字符= 50}}< / h1 >{{#条}}{{#与作者 }} {{../../ 篇文章。标题}}…{{和}}<文> {{article.body}} < / >的文章

您可能希望进行防御，并在未指定作者时呈现特定的消息。您可能会决定使用an如果Block这样做，如下所示:

<标题>{{摘录的文章。标题字符=50}}{{#如果文章。作者}}{{带文章的#。作者}}…{{/with}} {{else}}本文没有作者!{{/如果}}<文> {{article.body}} < / >的文章

注意，在帮助中心中，article.author实际上永远不会为空。我们只是为了这个例子才这么做的。

上面的代码段工作得很好，但是您也可以使用其他的阻塞在与构造。如果参数为false，则执行else块。示例修改如下:

<标题>{{摘录的文章。标题字符=50}} {{#with article。作者}}…{{else}}这篇文章没有作者!{{和}}<文> {{article.body}} < / >的文章

使用一个其他的块还使代码更具可读性。

将根上下文传递给助手

使用这关键字将当前根上下文传递给助手。假设你有render_author接收文章对象作为参数，以便显示其作者的详细信息。你可以使用这关键词如下:

<标题>{{摘录的文章。标题字符=50}} {{#with article}} {{render_author this}} {{/with}} 
{{article.body}}

这将被解析为文章。

访问数组中的项

一些帮助中心属性由对象数组组成。例如，附件属性由附件数组组成。

要访问数组中的项，需要遍历每个项。的每一个Helper就是这样做的。例子:

<标题>{{摘录的文章。标题字符=50}} {{#with article。作者}}…{{和}}<文> {{article.body}} < / >的文章{{#每个附件}}< a href = " {{url}}”目标= "平等" >{{名称}}< / > < span >({{大小}})< / span >{{/每个}}

上面的代码片段列出了所有附件。每个列表项显示特定于一个附件的数据，例如它的url，名字,大小。

就像与，每一个更改其块中的上下文。这意味着如果您想访问外部上下文，可以使用. . /符号。

您可能希望在数组为空时呈现消息。可以很容易地实现这一点如果Block，具体如下:

…{{#如果附件}}{{#每个附件}}< a href = " {{url}} "目标= "平等" >{{名称}}< / > < span >({{大小}})< / span >{{/每个}}{{其他}}不好意思,没有附件!{{/如果}}

这很好，但你也可以使用其他的块使代码更容易阅读:

…{{#每个附件}}< a href = " {{url}}”目标= "平等" >{{名称}}< / > < span >({{大小}})< / span >{{其他}}不好意思,没有附件!{{/每个}}

长度

每个数组都有一个隐式长度属性，该属性提供数组中元素的数量。例如，如果要显示附件的数量，请使用长度性质如下:

…有{{attachment .length}}。{{#每个附件}}< a href = " {{url}}”目标= "平等" >{{名称}}< / > < span >({{大小}})< / span >{{/每个}}

子表达式

子表达式允许在单个表达式中调用多个帮助程序，并将内部帮助程序调用的结果作为参数传递给外部帮助程序。子表达式由括号分隔。

下面的例子展示了表达式中的子表达式:

{{搜索占位符=(dc "search_text")}}

子表达式可以嵌套:

{{搜索占位符=(摘录(dc "search_text"))}}

子表达式可用于条件帮助器:

{{#if(比较集合。长度"==" 0)}}
< div >空集合。< / div >
{{其他}}
您的集合有{{collection。长度}}项目< / div >
{{/如果}}

子表达式可以在数组迭代器帮助器中使用:

{{#每个(切片)过滤用户。徽章on="category_slug" ="成就")
0 4)}}

< >节
< h3 >{{名称}}< / h3 >
< div >{{描述}}< / div >
< / >节
{{/每个}}