node using art-template filter

introduction

  • art-templateFilters in my opinion, in fact, is the definition of a function, the associated data processing template string by calling the function, the corresponding return results displayed on the page. So we can register a filter, process related data. Use this node+expressexample sub. art-template filter

Download the relevant package

 npm install express-art-template art-template --save

art-template Filter Syntax

  • Sign filter

    Registered two filters dateFormat、timestamp, in fact, is to template.defaults.importsadd the appropriate way to handle our data.

 template.defaults.imports.dateFormat = function(date, format){...}
 template.defaults.imports.timestamp = function(value){...}
  • Using filters

    Its syntax is similar to the pipeline operator, i.e., a filter output value of the parameters or data will be used as a filter of the next

 {{data | timestamp |  dateFormat}}

Using art-template

The following documents introduced in the app, art-templatethe default is to read the project root viewsfolder of artfiles, you can app.engine('html', require('express-art-template'))modify the htmlfile, you can also modify the folder read app.set('views', '具体文件夹'), you can use a relative path or absolute path.

 var express = require('express')

 const template = require('art-template')
 app.engine('html', require('express-art-template'))

 app.get('/filter', (req, res) =>{
    res.render('filter.html')
 })

 //注册一个过滤器 通过处理时间戳 转为日期格式
 template.defaults.imports.getDate = (dateTime) =>{
    const datetime = new Date(dateTime)

    const year = datetime.getFullYear()
    const month = ("0" + (datetime.getMonth() + 1)).slice(-2)
    const date = ("0" + datetime.getDate()).slice(-2)
    const hour = ("0" + datetime.getHours()).slice(-2)
    const minute = ("0" + datetime.getMinutes()).slice(-2)
    const second = ("0" + datetime.getSeconds()).slice(-2)

    return  year + "-"+ month +"-"+ date +" "+ hour +":"+ minute +":" + second
 }

filter.html file

 <!DOCTYPE html>
 <html lang="en">
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <meta http-equiv="X-UA-Compatible" content="ie=edge">
     <title>Document</title>
 </head>
 <body>
     <p>传入时间搓可获取时间格式</p>
     <span>{{ 1568078584726 | getDate}}</span>
 </body>
 </html>

The browser displays the results

Guess you like

Origin www.cnblogs.com/HJ412/p/11495588.html