在express站点中使用ejs模板引擎

1.首先新建文件夹并在这个文件夹里安装ejs

安装命令:cnpm install ejs --save

2.创建一个ejs文件

doma.ejs 怎么写呢(看下图)

<%= name %>

3.创建一个html文件

dome.html

4.创建express 本地服务器

express.js

里面怎么写呢看下面

var express = require("express");

var app = express();

//跨域

app.all("*",function(req,res,next){

    res.header("Accrss-Control-Allow-Origin","*")

    next();

})

//设置模板引擎 ejs

app.set("view engine","ejs");

//设置模板引擎ejs的存放目录

app.set("views","./component");

//设置静态目录

app,use(express.static(__dirname+"./public/"));

//声明变量 获取数据

var data = require("./public/data.json");

console.log(data)

//设置默认页面

app.get("/",function(req,res){

    res.sendFile(__dirname+"./component/dome.html")

})

//设置路由传参

app.get("/a/:id",function(req,res){

    //用户请求过来的id

    var id = req.params.id;

    //过滤并匹配id

    var datalist = data.filter(item=>item.id==id)[0];

    res.render("doma",datalist)

})

//设置端口号

app.listen(8087,function(){

    console.log("prot 8087")

})

5.运行上一步写的本地服务器

node express.js

6.在html文件里面用ajax获取数据

$.ajax({
            url: "http://127.0.0.1:8087/data.json",
            dataType: "json",
            type: "get",
            success: function (res) {
                console.log(res)
            }
        })

7.最后把数据渲染到页面上

8.查看的话就打开浏览器,输入端口号就行!

9.查看详情

详情
//${i.id} 这个就是利用jQuery.js插件,获取数据并拿到的id

你可能感兴趣的:(在express站点中使用ejs模板引擎)