Liquid 语法说明

大家好，欢迎来到IT知识分享网。

Liquid 是一门开源的模板语言，由 Shopify 创造并用 Ruby 实现。Jekyll 将 Liquid作为自身的模版语言，并且添加了许多对象object、标记tag和过滤器filter。这些新增内容包括代表内容页面的对象、用于在页面中引入内容片段的标记tag，以及用于操作字符串和 URL 的过滤器。

在Liquid中有两种类型的标记：Output和 Tag

Output标记（有些可能解析文本）被包含在：{{ 两个配对的花括号中 }}类似：<%=variable>

Tag标记（不能解析文本）被包含在:{ % 成对的花括号和百分号中 % }类似:<% int i=2 ;%>

输出(Output)

下面是关于输出标记的简单实例：

Hello {{name}}

Hello {{user.name}}

Hello {{ 'tobi' }}

§ 高级输出：过滤器
过滤器输入标记带有过滤器，方法很简单。第一个参数总是过滤器左边值的输出。当下个过滤器运行时，刚刚所得到的过滤器返回值就会成为新的左边值。直到最后没有过滤器时，模板就会接受最后的结果字符串。

Hello {{ ‘tobi’ | upcase }}输出结果是：Hello TOBI

Hello tobi has {{ ‘tobi’ | size }} letters!输出结果是：Hello tobi has 4 letters!

Hello {{ ‘tobi’ | capitalize }}输出结果是:Hello Tobi

Hello {{ ‘1984-02-01’ | date: “%Y” }}输出结果是：Hello 1984

§ 标准过滤器

date – 格式化日期 语法参考

capitalize – 将输入语句的首字母大写

downcase – 将输入字符串转为小写

upcase – 将输入字符串转为大写

first – 得到传递数组的第一个元

last – 得到传递数组的最后一个元素

join – 将数组中的元素连成一串，中间通过某些字符分隔

sort – 对数组元素进行排序

map – 从一个给定属性中映射/收集一个数组

size – 返回一个数组或字符串的大小

escape – 对一串字符串进行编码

escape_once – 返回一个转义的html版本，而不影响现有的转义文本

strip_html – 去除一串字符串中的所有html标签

strip_newlines – 从字符串中去除所有换行符(\n)

newline_to_br – 将所有的换行符(\n)换成html的换行标记

replace – 匹配每一处指定字符串，如 {{ ‘foofoo’ | replace:’foo’,’bar’ }} #=> ‘barbar’

replace_first – 匹配第一处指定的字符串，如 {{ ‘barbar’ | replace_first:’bar’,’foo’ }}#=> ‘foobar’

remove – 删除每一处匹配字符串，如 {{ ‘foobarfoobar’ | remove:’foo’ }}#=> ‘barbar’

remove_first – 删除第一处匹配的字符串，如 {{ ‘barbar’ | remove_first:’bar’ }}#=> ‘bar’

truncate – 将一串字符串截断为x个字符

truncatewords – 将一串字符串截断为x个单词

prepend – 在一串字符串前面加上指定字符串，如 {{ ‘bar’ | prepend:’foo’ }} #=> ‘foobar’

append – 在一串字符串后面加上指定字符串，如 {{ ‘foo’ | append:’bar’ }} #=> ‘foobar’

minus – 减，如 {{ 4 | minus:2 }}#=> 2

plus – 加，如{{ ‘1’ | plus:’1′ }} #=> ‘11’, {{ 1 | plus:1 }} #=> 2

times – 乘，如{{ 5 | times:4 }}#=> 20

divided_by – 除，如 {{ 10 | divided_by:2 }}#=> 5

split – 将一串字符串根据匹配模式分割成数组，如 {{ “a~b” | split:~ }}#=> [‘a’,’b’]

modulo – 余数，如 {{ 3 | modulo:2 }}#=> 1

标签(Tags)

Tags用于你的模板逻辑处理。

下列是当前已经支持的标签：

assign – 将一些值赋给一个变量

capture – 块标记，把一些文本捕捉到一个变量中

case – 块标记，标准的case语句

comment – 块标记，将一块文本作为注释

cycle – Cycle通常用于循环轮换值，如颜色或DOM类

for – 用于循环For loop

if – 标准的 if/else 块

include – 包含其他的模板；对于区块化非常有效

raw – 暂时性的禁用的标签的解析

unless – if语句的简版

omments

注释是最简单的标签，它只是把内容包含起来。

{% raw %}
     We made 1 million dollars {% comment %} in losses {% endcomment %} this year`
{% endraw %}

Raw暂时性的禁用的标签的解析。这在需要展示一些可能产生冲突的内容（如本页面，要展示liquid语句，就需要包含在raw标签间，否则会被解析）时非常有用。

{% raw %}
    In Handlebars, {{ this }} will be HTML-escaped, but {{{ that }}} will not.
{% endraw %}

if/else/

Liquid使得你可以通过if或unless（elsif和else为可选）编写简单的表达式:

    {% if user %}
      Hello {{ user.name }}
    {% endif %}

    {% if user.name == 'tobi' %}
      Hello tobi
    {% elsif user.name == 'bob' %}
      Hello bob
    {% endif %}

    
    # Same as above
    {% unless user.name == 'tobi' %}
      Hello non-tobi
    {% endunless %}

Case
如果你需要更多的条件判断，你可以使用case语句:

     {% case condition %}
         {% when 1 %}
             hit 1
         {% when 2 or 3 %}
             hit 2 or 3
         {% else %}
             ... else ...
     {% endcase %}

cycle
我们常常需要在不同的颜色或类似的任务间轮流切换。Liquid对于这样的操作有内置支持，通过使用cycle标签。

   
     {% cycle 'one', 'two', 'three' %}
     {% cycle 'one', 'two', 'three' %}
     {% cycle 'one', 'two', 'three' %}
     {% cycle 'one', 'two', 'three' %}     

     will result in     

     one
     two
     three
     one

for
循环Liquid允许循环一个集合 :

    {% for item in array %}
      {{ item }}
    {% endfor %}

§ 在每次循环期间，下列的帮助变量都可用于额外的展示需要:

forloop.length : length of the entire for loop

forloop.index : index of the current iteration

forloop.index0 : index of the current iteration (zero based)

forloop.rindex : how many items are still left?

forloop.rindex0 : how many items are still left? (zero based)

forloop.first : is this the first iteration?

forloop.last : is this the last iteration?

§ 你可以使用一些属性来影响接受循环中的哪项,一些变量可以用来处理循环时选择性处理

limit:int : 使你可以限制接受的循环项个数;
offset:int : 可以可以让你从循环集合的第n项开始.

    array = [1,2,3,4,5,6]
    {% for item in array limit:2 offset:2 %}
     {{ item }}
    {% endfor %}



    results in 3,4

§ 反序遍历

     {% for item in collection reversed %}
       {{item}}
      {% endfor %}

§ 除了对一个已经存在的集合进行循环，你还可以定义一段范围区域内的数字进行循环。这段区域既可以通过文字也可以通过变量数定义得到:

      # if item.quantity is 4...
      {% for i in (1..item.quantity) %}
        {{ i }}
      {% endfor %}      
      

      results in 1,2,3,4

assign

§ 变量赋值(Variable Assignment)
你可以把数据存储在你自己定义的变量中，以便在输出或者其他标签中使用。创建一个变量的最简单方式是使用assign标签，其语法也是简单明了的：

     {% assign name = 'freestyle' %}     

     {% for t in collections.tags %}
       {% if t == name %}
           <p>Freestyle!</p>
       {% endif %}
     {% endfor %}

§ 赋值布尔值
另一种常见用法是把true / false值赋给变量:

      {% assign freestyle = false %}      

      {% for t in collections.tags %}
        {% if t == 'freestyle' %}
          {% assign freestyle = true %}
        {% endif %}
      {% endfor %}      

      {% if freestyle %}
        <p>Freestyle!</p>
      {% endif %}

§ 赋值处理过的数据
如果你希望把一系列字符串连接为一个字符串，并将其存储到变量中，你可以使用capture标签。这个标签是一个块级标签，它会”captures”任何在其中渲染的元素，并把捕获的值赋给给定的变量，而不是把这些值渲染在页面中。

     {% capture attribute_name %}{{ item.title | handleize }}-{{ i }}-color{% endcapture %}     

     <label for="{{ attribute_name }}">Color:</label>     

     <select name="attributes[{{ attribute_name }}]" id="{{ attribute_name }}">     

       <option value="red">Red</option>     

       <option value="green">Green</option>     

       <option value="blue">Blue</option>     

     </select>

中文官网：https://liquid.bootcss.com/basics/variations/;

英文文档参考:https://github.com/Shopify/liquid/wiki/Liquid-for-Designers;

CSDN blog的翻译:http://blog.csdn.net/dont27/article/details/38097581