、 Install dependent components

npm i consolidate -D
npm i ejs -D

2、 Layout server

const express = require('express');
const consolidate = require('consolidate');
let server = express();
server.listen(8087);
// Choose a template engine
server.engine('html', consolidate.ejs);
// Set the extension of the template file
server.set('view engine', 'ejs');
// Specify the path to the template file , At the same time, create www Folder Directory
server.set('views', './www');
server.get('/list', (req, res) => {
// Rendering list.ejs file
res.render('list', {data: ['aaaa', 'bbbb', 'cccc', 'dddd', 'eeeee']});
})

3、 Front end layout

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<!-- It's a public part -->
<!-- Be careful : Inside include It doesn't contain www This level of directory is -->
<%-include('./header.ejs') %>
<p> This is a list </p>
<%if(data.length>0){%>
<ul>
<%for(let i=0;i<data.length;i++){ -%>
<li><%=data[i]%></li>
<%}%>
</ul>
<%}-%>
<!-- Be careful :
<% %> => place javascript Code
<%= %> => Place variable
<% -%> => Don't wrap output
<%- %> => It can be interpreted as html Code
-->
</body>
</html>

The final result is displayed

node.js Page rendering method of ejs More articles about

  1. Node.js Static page display example 2

    Routine Download :https://files.cnblogs.com/files/xiandedanteng/nodejsStaticHtmlSample.rar Page effects : Html Page code ( Pay attention to text editing ...

  2. Node.js Manual query -4-Express Method

    express label ( The blank space to separate ): node.js express [TOC] install : In the new version, the command line tools are separated npm install -g express // install express then npm ...

  3. Node.js Manual query -5-Ejs Method

    express Use in // Set template directory app.set('views', path.join(__dirname, 'views')); // Set up the template engine app.set('view engine' ...

  4. Node.js Primary and Express Method to realize the principle of registration and login

    Because this article only realizes its principle , So there's no database , It's just js It's a simulated database , Of course, we need to use the database in the project . 1.node.js A native method ①html page , It's simple , There's no beautification ~ We call it the user.html & ...

  5. vue Pass through js Control page style methods

    In the use of vue.js Frame time , Sometimes I want to finish rendering the page , Then execute the function method to handle initialization related operations , If you only deal with page positions . Wide or high , You have to render the page completely before you can , Before the page has finished loading , The width and height obtained are not ...

  6. Node.js Manual query -3-Mongoose Method

    Mongoose Reference manual label ( The blank space to separate ): MongoDB Mongoose What is it? ? Generally we don't use it directly MongoDB Function to operate MongoDB database Mongose It's a set of operations MongoDB data ...

  7. stay CentOS 7 Installation on Node.js Of 4 Methods (yum Installation and source installation )

    CentOS 7 Installation method on , Which covers the source code installation , Compiled version installed ,EPEL(Extra Packages for Enterprise Linux) Install and pass through NVM(Node version mana ...

  8. stay CentOS 7 Installation on Node.js Of 4 Methods ( contain npm)

    Node.js and Javascript Inextricably linked , so to speak Node.js Give Way Javascript It's never been so powerful . ok … Micro devil is actually a layman … But it doesn't stop micro magic from learning to explore the unknown ~ Hang out abroad today , see ...

  9. JS Implementation of page refresh method

    Here's how to refresh the whole page : Sometimes it's possible to use window.location.reload() Refresh current page . parent.location.reload() Refresh the parent object ( Used in the framework of ) opener.loc ...

Random recommendation

  1. tomcat7 IP Limit configuration

    server.xml  </Host> Add before <Valve className="org.apache.catalina.valves.RemoteAddrValve&quo ...

  2. Talking about Js Archetypal understanding

    One .js There is no doubt that there is a difficulty in prototypes in , It's easy to faint if you don't study deeply !    After consulting various materials , I found that explanations were too professional , For many people who haven't been exposed to object orientation     For Xiaobai of language , I can't understand the proper nouns in it ! If you don't ...

  3. Oracle TNS Configuration analysis

    1. What is? TNS? TNS yes Oracle Net Part of , Dedicated to managing and configuring Oracle Database and client connection tool , In most cases, the client and the database communicate , You have to configure TNS, In a few cases, of course , Don't need to configure T ...

  4. [Swust OJ 763]-- Trees outside the school gate Plus( Violence enumeration )

    Topic link :http://acm.swust.edu.cn/problem/0763/ Time limit(ms): 1000 Memory limit(kb): 65535 Outside a University of science and technology in Southwest China is ...

  5. java web From zero to 21 《Hibernate》 How to generate primary key , Users add and display user list

    1. newly build register.jsp <%@ page language="java" import="java.util.*" pageEncoding=& ...

  6. 【Unity 3D】 course (1) Set up the scene

    1. Create a new terrain Select in menu Terrain, Create a new terrain Next on the right “ Edit height ” in , Draw the height of the terrain with a brush , Pictured : 2. Terrain texture Next we texture the terrain , Texture resources we use unity Self contained , stay Pr ...

  7. Spring boot+mybatis+thymeleaf Achieve login registration , Additions and deletions

    This paper focuses on the realization of understanding , filter , Business , Logical requirements , Please ignore the style .. The project structure is as follows 1.idea newly build Spring boot project , stay pom Medium plus thymeleaf and mybatis Support .pom.xml The code is as follows < ...

  8. Zookeeper Source code learning ( One ) Environment building

    Preface Recently ready to learn Zookeeper, Want to Zookeeper Start to understand all kinds of middleware gradually , Learning distributed computing . Download the source code Execution instruction , Download code : git clone https://github.com ...

  9. C++ getline Judge the blank line

    C++ in getline Used to read characters line by line , Format getline( character string , Number of characters ) Put this line “ Number of characters ” Read in characters of “ character string ” How to judge whether the read line is empty ? strlen( character string )==0 It's nothing

  10. Cognos11 Pass through URL visit report Set up

    1: In the past cognos Version can be found in the properties of the report url Properties of , With a little modification, you can pass URL Visited 2:Cognos11 I've been looking for it for a long time, but there's no report URL This attribute , however IBM The authorities have come up with a solution Answe ...