TrimPath模板引擎使用指南

 
 

  
  
${expr}
  
  
${expr|modifier}
  
  
${expr|modifier1:arg1,arg2|modifier2:arg1,arg2|...|modifierN:arg1,arg2}
 
 

 
 

  
  
{if testExpr}
  
  
    {elseif testExpr}
  
  
    {else}
  
  
{/if}
 
 

 
 

  
  
{for varName in listExpr}
  
  
{/for}
  
  

  
  
{for varName in listExpr}
  
  
    ...循环主体...
  
  
{forelse}
  
  
    ...当 listExpr 是 null 或者 length 为 0 ...
  
  
{/for}
 
 

 
 

  
  
{var varName}
  
  
{var varName = varInitExpr}
 
 

 
 

  
  
{macro macroName(arg1, arg2, ...argN)}
  
  
    ...macro 主体...
  
  
{/macro}
 
 

 
 

  
  
{cdata}
  
  
    ${customer.firstName} ${customer.lastName}
  
  
{/cdata}
 
 

 
 

  
  
{eval} 
  
  
...模板渲染的时候执行的 JavaScript 代码... 
  
  
{/eval
 
 

 
 

  
  

  
  
      display:none;
  
  
      margin: 1em;
  
  
      border: 1px solid #333;
  
  
      background: #eee;
  
  
      padding: 1em;
  
  
    {/minify}">
  
  
  ...
  
  

修饰符 Modifier

修饰符用来处理上一个表达式的结果，并输出内容。类似于 Linux shell 中的 pipe 命名，可以串联

 
 

  
  
${name|capitalize}
  
  
${name|default:"noname"|capitalize}
 
 

内置修饰符

• capitalize 返回大写内容
• default:valueWhenNull 如果内容为 null，返回 valueWhenNull
• eat 返回空内容，一般用于表达式求值后又不想展示输出的内容
• escape 转换 HTML 字符实体，比如： & 转换成 &
• h 和 escape 效果一样

自定义修饰符

算定义修饰符可以持载到 contextObject 上的 _MODIFIERS 属性上

 
 

  
  
var Modifiers = { toFixed: function(n, num) { return n.toFixed(num) } } 
  
  
var out = '{var nu = 12}${nu|toFixed:2}'.process({ _MODIFIERS: Modifiers });
 
 

宏 Macro

macro 一般用来封装可复用 HTML 模板，类似函数的功能。对于每个模板来说 macro 是私用的。如果想公用 macro，可以保存 macro 引用到 contextObject 上(下次调用 process() 方法的时候再手动挂载上!? )。需要在调用 process() 方法之前给 contextObject 设置一个空的 exported 属性：contextObject['exported'] = {}这个公用的 macro 设计的有点奇葩，可以参考这个 示例

 
 

  
  
{macro link(href, name)}
  
  
    ${name}
  
  
{/macro}
  
  

  
  
${link('http://google.com', 'google')}      => google
  
  
${link('http://facebook.com', 'facebook')}  => facebook
 
 

示例

 
 

  
  
var data = {
  
  
    name: 'iPhone 6 Plus',
  
  
    weight: 480,
  
  
    ram: '16gb',
  
  
    networks: [
  
  
        '移动（TD-LTE)',
  
  
        '联通(TD-LTE)',
  
  
        '电信(FDD-LTE)'
  
  
    ]
  
  
}
  
  

  
  
data._MODIFIERS = {
  
  
    toFixed: function(n, num) {
  
  
        return n.toFixed(num)
  
  
    }
  
  
}
  
  

  
  
var template = '\
  
  
名称: ${name}
\
  
  
重量：${weight|toFixed:2}
\
  
  
内存：${ram|capitalize}
\
  
  
网络：\
  
  
{for item in networks}\
  
  
  {if item_index!=0}|{/if}\
  
  
  ${item}\
  
  
{/for}';
  
  

  
  
template.process(data)
 
 

上面的代码输出：

 
 

  
  
名称: iPhone 6 Plus

  
  
重量：480.00

  
  
内存：16GB

  
  
网络：
  
  
  移动（TD-LTE)
  
  
 | 联通(TD-LTE)
  
  
 | 电信(FDD-LTE)
 
 

【本文是专栏作者周琪力的原创稿件，转载请注明出处】

分享标题：TrimPath模板引擎使用指南
浏览地址：http://www.shufengxianlan.com/qtweb/news9/347459.html

网站建设、网络推广公司-创新互联，是专注品牌与效果的网站制作，网络营销seo公司；服务项目有等

广告

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源： 创新互联