当前位置: 首页 > 软件库 > 程序开发 > 模板引擎 >

Tinyliquid

JavaScript Liquid模板引擎
授权协议 MIT
开发语言 JavaScript
所属分类 程序开发、 模板引擎
软件类型 开源软件
地区 国产
投 递 者 裴弘
操作系统 跨平台
开源组织
适用人群 未知
 软件概览

TinyLiquid是一个基于JavaScript,兼容Liquid模板语法的的模板引擎。 其具有以下特点:

  • 支持异步本地和异步过滤器

  • 轻松添加自定义标签和自定义过滤器

  • 几乎完全支持液体语法

  • 支持Express 3.x框架

  • 高测试覆盖率(92%覆盖率)

下载 & 安装

目前最新版为v0.0.9,可通过以下方式来获取TinyLiquid模块:

  • 通过NPM安装:npm install tinyliquid

  • 通过git下载:git clone git://github.com/leizongmin/tinyliquid.git

  • 浏览器端使用:

  • Express 3.x中使用:模块express-liquid

Liquid模板语法

Liquid是一个比较优秀的轻量级的模版语言。详见:Liquid官网

基础

Liquid有两种形式的标签,即输出标签逻辑标签。这两种标签的区别在于:

输出标签:用于处理模版输出值,使用{{}}包围,如下: {{ product.title }}

逻辑标签:用于处理模版逻辑,使用{%%}包围,如下: {% if product.price > 100 %}

输出标签

如下面例子: 你好 {{name}}
你好 {{user.name}} 你好 {{ 'shopqi' }}

过滤器

输出标签的内容可以通过过滤器来进行格式化操作。例如,我们将‘shop’的转化成大写输出,可使用如下形式的标签 {{ 'shop' | upcase}}

逻辑标签

逻辑标签用于处理模版中的逻辑关系,ShopQi支持如下标签

if/else/unless

用于判断条件,参数为boolean值:

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

{% if user.name == 'tobi' %}
  hi tobi
{% endif %}

{% if user.name != 'tobi' %} 
  hi non-tobi
{% endif %}

{% unless user.name == 'tobi' %} 
  hi non-tobi
{% endunless %}

{% if user.name == 'tobi' or user.name == 'marc' %} 
  hi marc or tobi
{% endif %}

{% if user.name == 'tobi' and user.last_name == 'scottish' %} 
  hi tobi scottish
{% endif %}

{% if user.name contains 'tobi' %} 
  hi tobias
{% endif %}

{% if user.creditcard == nil %}
   poor sob
{% endif %}

{% if user.payments == empty %}
   you haven't paid yet! 
{% endif %}

{% if user.age > 18 %}
   Login here
{% else %}
   Sorry, you are too young
{% endif %}

{% unless user.age > 18 %}
  Sorry, you are too young
{% else %}
  Login here
{% endunless %}

case语句块

如果一个情况存在多个分支的情况,可使用case来处理:

{% case condition %} 
  {% when 1 %} 
    hit 1 
  {% when 2 %} 
    hit 2 
  {% else %} 
    hit else
{% endcase %}

cycle标签

通常情况下,我们有时候需要循环交替的执行某些任务。Liquid支持这种周期性的执行任务的标签,如下:

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

结果为:

one
two
three
one

如果,我们使用

for标签

liquid支持集合数据循环,如:

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

同样还支持如下一些辅助方法: forloop.length # => 整个循环的总次数 forloop.index # => 当前循环的下标 forloop.index0 # => 当前循环的下标(从0开始算) forloop.rindex # => 计算还剩下多少次数未执行 forloop.rindex0 # => 计算还剩下多少次数未执行(从0开始计算) forloop.first # => 是否是集合的第一次循环 forloop.last # => 是否是集合的最后一次循环

for循环还支持一些属性limit,offset,其中,limit用于限制集合循环次数,offset用于设置开始的下标,如:

# array = [1,2,3,4,5,6]
  {% for item in array limit:2 offset:2 %} 
    {{ item }}
  {% endfor %} 
  # results in 3,4 
同样,for里面还支持范围的定义,即..用来取得范围,如:
  # if item.quantity is 4...
  {% for i in (1..item.quantity) %}
    {{ i }}
  {% endfor %}
  # results in 1,2,3,4

Tables

Liquid同样支持创建表格,创建行和列

{% tablerow item in items cols: 3 limit: 12 %}
    {{ item.variable }}
  {% endtablerow %}

变量赋值assign

当我们需要为变量赋值时,我们可以使用assign来进行定义我们需要的变量:

{% assign name = 'freestyle' %}
{% for t in collections.tags %}
{% if t == name %}

Freestyle!

{% endif %} {% endfor %}

 相关资料
  • 具体查看ejs官方文档 https://github.com/mde/ejs

  • 我们自己实现了一个轻量级的模板引擎,不要问为什么不用smart之类的,因为我们认为没有必要为了一个小小的模板引擎而引入smaart这样复杂的实现。你可能会说,smart功能强大,支持各种标签,标签也是很强大,而且还可以对模板引擎进行各种"灵活"的配置... 这里我们觉得有必要说明一下: 框架的内置模板引擎基本上实现了我们日常开中所有常用的标签。 不常用的标签我们也做了巧妙的实现。 我们只提供了扩展

  • 内置模板引擎 视图的模板文件可以支持不同的解析规则,默认情况下无需手动初始化模板引擎。 可以通过下面的几种方式对模板引擎进行初始化。 配置文件 内置模板引擎的参数统一在配置目录的template.php文件中配置,例如: return [ // 模板引擎类型 支持 php think 支持扩展 'type' => 'Think', // 模板路径 '

  • Warning: The packages listed below may be outdated, no longer maintained or even broken. Listing here does not constitute an endorsement or recommendation from the Expressjs project team. Use at your

  • Use the app.engine(ext, callback) method to create your own template engine. ext refers to the file extension, and callback is the template engine function, which accepts the following items as parame

  • hi-nginx-java内置了两个mustache模板引擎:mustache.java和jmustache。 以下介绍仅就jmustache而言。 字符串模板 字符串模板是最简单的情况。例如: package test; import hi.request; import hi.response; import hi.route; import java.util.regex.Matcher

  • 快速开始 安装模块 # 安装koa模板使用中间件 npm install --save koa-views # 安装ejs模板引擎 npm install --save ejs 使用模板引擎 demo源码 https://github.com/ChenShenhai/koa2-note/blob/master/demo/ejs/ 文件目录 ├── package.json ├── index.js

  • 模版引擎 引入 我们在使用ajax请求数据时,返回的如果是一个 JSON 格式的字符串,我们需要将其包装到对应的HTML代码中,再添加到页面上,才能看到效果。那么这个包装得过程有没有简单的方法呢? 假设在 js 中有如下数据: var obj = { name:"fox", age:18, skill:"卖萌" }; 希望包装为: <