模板引擎-2-模板引擎提供的模板语法

最新推荐文章于 2023-04-16 16:43:30 发布

笑道三千

最新推荐文章于 2023-04-16 16:43:30 发布

阅读量252

点赞数

分类专栏：数据库

本文链接：https://blog.csdn.net/weixin_42349568/article/details/108100615

版权

数据库专栏收录该内容

12 篇文章 0 订阅

订阅专栏

在这里插入图片描述

一，基础语法：

可以在里面直接输入模板属性，或者做基本运算，或者三目运算。
在这里插入图片描述

二，原文输出

在这里插入图片描述

三，条件判断

在这里插入图片描述

{{if age > 18}}
	年龄大于18
{{else if age < 15}}
	年龄小于15
{{else}}
	年龄不符合要求
{{/if}}

//导入模板引擎，返回值是一个方法
const template=require('art-template')
//拼接字符串的第三方模块
const path=require('path')

//template 方法是用来拼接字符串的
//参数1：模板路径，绝对路径
///参数2:要在模板中显示的数据 它是对象类型
//返回值是拼接好的字符串
const views = path.join(__dirname,'views','02.art')
const html=template(views,{
	name:'张三',
	age:20
})
console.log(html)

四，循环语法

在这里插入图片描述

const template = require('art-template');
const path = require('path');

const views = path.join(__dirname, 'views', '03.art');

const html = template(views, {
	users: [{
		name: '张三',
		age: 20,
		sex: '男'
	},{
		name: '李四',
		age: 30,
		sex: '男'
	},{
		name: '玛丽',
		age: 15,
		sex: '女'
	}]
});

console.log(html);

<ul>
	{{each users}}
		<li>
			{{$value.name}}
			{{$value.age}}
			{{$value.sex}}
		</li>
	{{/each}}
</ul>

在这里插入图片描述

四，子模板：把网站的共有部分提取到单独文件中

通常把这些共有文件放置在名为common的文件夹下。
在这里插入图片描述


{{include './common/header.art'}}
{{msg}}
{{include './common/footer.art'}}

const template = require('art-template');
const path = require('path');

const views = path.join(__dirname, 'views', '04.art');

const html = template(views, {
	msg:'我是首页'
});
console.log(html);