模板引擎art template

模板引擎art template

一、模板引擎基础概念

1.模板引擎:第三方模块

2.art-template模板引擎

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

使用const template = require ('art-template')引入模板引擎;

高速模板引擎要拼接的数据和模板在哪 const html = tempalte('模板路径',数据);

使用模板语法告诉模板引擎,模板与数据应该如何进行拼接。

3.代码示例

//导入模板引擎模块

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

//将特定模板与特定数据进行拼接

const html = template('./views/index.art',{

      data : {

        name : '张三',

        age : 20

      }

});

<div>

    <span>{{data.name}}</span>

</div>

二、模板引擎语法

1.模板语法

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

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

标准语法{{数据}

原始语法<%=数据%>

2.输出

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

<h2>{{value}}</h2>

<h2><%= value %></h2>

3.原文输出

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

标准语法{{@数据}

原始语法<%-数据%>

<h2>{{@value}}</h2>

<h2><%- value %></h2>

4.条件判断

标准语法

{{if 条件}}  ...  {{/if}}

{{if vl}}...{{else if v2}}...{{/if}}

原始语法

<% if (value) { %> ... <%} else if (v2) { %> ... <%} %>

5.循环

标准语法{{each 数据}}

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

{{each target}}

      {{$index}} {{$value}}

{{/each}}

<% for(var i=0; i<target.length;i++){%>< = i %}%> <%= target[i]%>

<%}%>

6.子模板

使用子模板可以将网站公共区块(头部、底部)抽离到单独的文件中。

标准语法{{include '模板'}}

原始语法<%include('模板')%>

{{include './header.art'}}

<% include ('./header.art') %>

7.模板继承

8.模板继承示例

<!doctype html>

  <html>

      <head>

          <meat charset="utf-8">

          <title>HTML</title>

      </head>

      <body>

          {{block 'content'}}{{/block}}

      </body>

    </html>

{{extend './layout.ary'}}

{{block 'head'}}  <link rel="stylesheet" href="custom.css"> {{/block}}

{{block 'content'}} <p>This is just an awesome page.</p>{{/block}}

9.模板配置

向模板中导入变量template.defaults.imports.变量名=变量值;

设置模板根目录template.defaults.root=模板目录

设置模板默认后template.default.extname='.art'ingmoding

三、第三方模块router

功能:实现路由

使用步骤:获取路由对象、调用旅游对象提供的方法创建路由、启用路由,使路由生效

const getRouter = require('router')

const router = getRouter();

router.get=('/add',(req,res) => {

      res.end('Hello World')

})

server.on('request',(req,res) => {

    router(req,res)

})

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。