方便实用的ejs语法

之前在学习node的过程中接触到express接着便选择学习ejs做一下全栈，ejs和html是兼容的，记录点常用语法。

以下是集中常用语法：

1.转义输出

<%= 变量名 %>

这个是转义输出,可以把变量名替换成自己需要的东西.
我们可以这么使用.

// js文件
ejs.renderFile('./views/test.ejs',{name:'wzz'},function(err,data){
  if(err){
    console.log(err);
  }else{
    console.log(data);
  }
});

  
  


  <%=name%>

最后我们可以发现name变量,在控制台被替换成了wzz.

2.js代码

<% Javascript代码 %>

这里面可以写javascript的代码.我们可以这么使用

// js文件
ejs.renderFile('./views/test.ejs',{json:{arr:[
  {user:'a',pass:'1'},
  {user:'b',pass:'2'},
  {user:'c',pass:'3'},
  {user:'d',pass:'4'}
]}},function(err,data){
  if(err){
    console.log(err);
  }else{
    console.log(data);
  }
});

  
  


  <%for(var i=0;i
    
user:<%=json.arr[i].user%> pass:<%=json.arr[i].pass%>

  <%}%>

然后我们发现控制台循环输出了div和里面的内容

user:a pass:1

user:b pass:2

user:c pass:3

user:d pass:4

3.不转义输出

<%- 变量名%>

不转义输出可以把定义的字符串不转义的输出.
我们可以这么用,这边我们省略了第二个不使用的json数据

// js文件
ejs.renderFile('./views/test.ejs',function(err,data){
  if(err){
    console.log(err);
  }else{
    console.log(data);
  }
});

  
  


  <% var str='
'; %>
  <%-str %>
  <%=str %>

输出结果如下

  

  <div><div>

4.使用include引入外部的文件

<% include 文件的地址 %>

我们先新建一个txt文件,随便在里面填上一点内容供测试使用.
js文件和上面的一样,所以省略,下面是ejs文件

  
  


  <% include ../content.txt %>

我们发现控制台正确的输出了我们想要的内容

  
  


    hello world

最关键就是这个include用法，用的好会很省力
例如创建一个ejs文件存放公用代码例如公用导航栏的代码layout.ejs

    
    
    



    

        

            后台管理
        
        

            

                
用户管理

                

                    分类管理
                    

                        
分类列表
                        
分类添加
                    
                
                

                    内容管理
                    

                        
内容列表
                        
内容添加
                    
                
            
            

                

                    <%= userInfo.username%>
                    

                        
退出后台管理
                    
                
            
        
    

然后你的后台主页就可以这样写

<%- include('./layout') %>

    

        
Hello, world! <%= userInfo.username %>
        
欢迎来到我的博客后台管理
    

这样就能输出整张完整的页面，你在写一些功能提示页面的时候就不必重写代码，简化了代码结构

这就是比较常用的4个小方法啦。

参考文章