模版引擎(art-template)的基础概念

模版引擎

模版引擎是第三方模块

让开发者以更加友好的方式拼接字符串,使项目代码更加清晰,更加用于维护

art-template模版引擎

 1. 在命令行工具中使用npm install  art-template 命令进行下载

2.使用const template = require(' art - template ' )引入模版引擎

3. 告诉模版引擎要拼接的数据和模版在哪 const html = template(' 模版路径 ' ,数据 );

art-temlate 代码示例

模版语法

 art-template 同时支持两种模版语法:标准语法和原始语法

 标准语法可以让模版更容易读写,原始语法具有强大的逻辑处理能力

标准语法: {{数据}}

原始语法:<%=数据%>

输出

将某项数据输出模版中,标准语法和原始语法如下:

标准语法:{{ 数据 }}

原始语法:<% = 数据%>

原文输出

如果数据中携带HTML标签 默认模版引擎不会解析标签,会将其转义后输出

标准语法:{{ @数据 }}

原始语法:<% - 数据%>

条件判断

在模版中可以根据条件来决定显示哪块HTML代码

循环

标准语法 : {{ each 数据 }} {{ /each}}

原始语法:<% for() { % > <% } %>

子模板

使用子模板可以讲网站公共区块(头部,底部)抽离岛单独的文件中

标准语法:{{ include  ' 模版 ' }}

原始语法 :<% include { ' 模版 ' }%>

模版继承

使用模版继承可以讲网站HTML 骨架抽离到单独的文件中,其他页面模版可以继承骨架文件

 

模版继承示例

 

模版配置

1.在模版中导入变量 template.defaults.imports.变量名 = 变量值 ;

2.设置模版根目录  template.defaults.root = 模版目录

3.设置模版默认后缀   template.defaults.extname = ' . art '

 

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 2
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值