Node.js之Express三
端午节3天说没就没了,自己的脚伤都快一个月了还没好,原本想着去桂林或者厦门呢,可计划赶不上变化,看自己公司C#软件工程师的招聘条件有要求MongoDb,年前就打算自己学习下,买的这本书就叫Node.js+MongoDB+AngularJs Web开发。自己也大致看了下,和SQL Server差不多,可能一些名词定义等不一样,但Node.js还剩Express这块没学完,所以还是先把Express学完了再学MongoDb吧。
一、Express模板引擎介绍
今天看了下Express实现模板引擎部分,模板大家都很常见,在asp.net中也有模板,例如GridView中的模板、页面模板等,模板体现了复用的思想。在Express中也有模板。Express常见的模板引擎主要有两种:Jade和内嵌的Javascript(EJS).下面是它们两个的区别:
Jade使用HTML的速记符号模板,看上去并不像HTML,但模板文件非常小,易于掌握,缺点是需要学习另一种语言
EJS使用特殊的符号在正常的HTML文档中嵌入Javascript,这更容易从正常的HTML过渡,不足之处是HTML文档比原始文档要复杂得多。
二、模板引擎的使用
1.安装jade和ejs模块
npm install jade npm install ejs

2.定义模板引擎
1)、定义模板引擎第一步是为Express定义一个默认的模板引擎。可以通过express()应用程序对象上对View Engine设定进行设置。
2)、把views设定位置为你的模板文件被存放的位置。
3)、为自己希望使用app.engine(ext,callback)方法来处理的模板扩展名注册模板引擎。ext参数是用于模板文件的文件扩展名,callback参数是支持Express的呈现功能的函数。许多引擎在一个_express函数中提供回调功能.例如:
app.engine('jade',require('jade')._express)
_express功能往往只能在默认的文件扩展名上工作,这种情况可以使用一个不同的函数。例如EJS提供了renderFile函数用于这一目的。可以使用下面的语句为ejs扩展名注册EJS:app.engine('ejs',require('ejs')._express).不过当想为HTML扩展名注册EJS需要使用:app.engine('html',require('ejs').renderFile).
一旦扩展名被注册,引擎回调函数被调用来呈现具有该扩展名的模板
3.加入本地对象
在呈现一个模板时,可能需要包括动态数据,这种情况下,可以生成一个locals对象,它包含映射到模板中定义的变量名称的属性。express()app对象提供了app.locals属性来存储本地变量。app.locals实际是一个函数对象,所以可以用两种不同的方式设置变量。
1.点语法
2.调用app.locals(object)来设置本地本地模板变量,其中object是一个javascript对象,它具有要设置的变量。 app.locals({title:'My App'},version:10).
4.创建模板
创建模板和创建类一样。要注意它的可重用性、规模和层次。
EJS模板比较简单,类似C#访问服务端变量一样通过<%=%><%-%><%%>来实现数据的呈现。类似C#中MVC的View
<%=%>是转义后的变量值
<%-%>不转义的变量值
<%%>javascript的逻辑代码
对于Jade模板这个我现在也没整明白,暂且放下,等以后再好好研究。
5.呈现模板
定义了一个模板也有数据了,怎么把数据显示到模板上呢?这就需要在响应中呈现模板。可以使用Express app对象或使用respons对象发送一个呈现后的模板,要呈现在Express app对象中的模板可以使用app.render()方法。
app.render(view,[locals],callback)
view参数指定views目录中的视图文件名,如果该文件没有包含扩展名,就尝试默认的扩展名。
locals参数允许传递一个locals对象
回调函数在模板被呈现后执行,并应该接受错误对象作为第一个参数,并以呈现后的模板的字符串形式作为第二个参数。
要直接把一个模板呈现为一个响应,则可以使用res.render()函数,它工作原理和app.render()完全一样,不同之处是不必有回调函数。所呈现的结果在响应中自动发送。如果不需要在发送之前对数据做任何处理,就可以使用res.render()方法,以避免需要额外的代码调用res.send()来发送数据。
6.demo
EJS模板
<!DOCTYPE html>
<html lang="en">
<head>
<title>EJS Template</title>
</head>
<body>
<h1>User using EJS Template</h1>
<%=title%>
<%-title%>
<ul>
<li>Name: <%= uname %></li>
<li>Vehicle: <%= vehicle %></li>
<li>Terrain: <%= terrain %></li>
<li>Climate: <%= climate %></li>
<li>Location: <%= location %></li>
</ul>
</body>
</html>
Jade模板
doctype html
html(lang="en")
head
title="Jade Template"
body
block content
extends main_jade
block content
h1 User using Jade Template
ul
li Name: #{uname}
li Vehicle: #{vehicle}
li Terrain: #{terrain}
li Climate: #{climate}
li Location: #{location}
呈现
var express = require('express'),
jade = require('jade'),
ejs = require('ejs');
var app = express();
app.set('views', './views');
app.set('view engine', 'jade');
app.engine('jade', jade.__express);
app.engine('html', ejs.renderFile);
app.listen();
app.locals.uname = "Brad";
app.locals.vehicle = "Jeep";
app.locals.terrain = "Mountains";
app.locals.climate = "Desert";
app.locals.location = "Unknown";
app.get('/ejs', function (req, res) {
app.locals.title="<h1>Jade<h1/>";
app.render('user_ejs.html', function(err, renderedData){
res.send(renderedData);
});
});
app.get('/jade', function (req, res) {
res.render('user_jade');
});


Node.js之Express三的更多相关文章
- Node.js、express、mongodb 实现分页查询、条件搜索
前言 在上一篇Node.js.express.mongodb 入门(基于easyui datagrid增删改查) 的基础上实现了分页查询.带条件搜索. 实现效果 1.列表第一页. 2.列表第二页 3. ...
- node.js和express.js安装和使用步骤 [windows]
PS: NODEJS:https://nodejs.org NPM:https://www.npmjs.com/ 一.node.js安装与配置 到https://nodejs.org/en/downl ...
- Node.js基于Express框架搭建一个简单的注册登录Web功能
这个小应用使用到了node.js bootstrap express 以及数据库的操作 :使用mongoose对象模型来操作 mongodb 如果没了解过的可以先去基本了解一下相关概念~ 首先注 ...
- Node.js系列-express(上)
前言 Node.js系列的第一篇:http,大概描述了通过使用node.js内置的api创建一个服务并监听request实现简单的增删改查.现在,我们就通过通读express官网及使用express框 ...
- node.js之express框架
之前学习过node.js接触过express框架,最近为了编写一个mock server正好用到了express.下面正好就跟大家介绍一下关于express.今天的内容主要围绕这么几个方面? expr ...
- Node.js、express、mongodb 入门(基于easyui datagrid增删改查)
前言 从在本机(win8.1)环境安装相关环境到做完这个demo大概不到两周时间,刚开始只是在本机安装环境并没有敲个Demo,从周末开始断断续续的想写一个,按照惯性思维就写一个增删改查吧,一方面是体验 ...
- node.js框架express的安装
node.js框架express的安装 首先假定你已经安装了 Node.js,接下来为你的应用创建一个目录,然后进入此目录并将其作为当前工作目录. $ mkdir myapp $ cd myapp 通 ...
- node.js,express入门看详细篇
先最简单的代码 安装 npm install express app.js 代码内容 const express = require('express') const app = express() ...
- node.js使用express框架进行文件上传
关于node.js使用express框架进行文件上传,主要来自于最近对Settings-Sync插件做的研究.目前的研究算是取得的比较好的进展.Settings-Sync中通过快捷键上传文件,其实主要 ...
随机推荐
- 浏览器中调用PHP在执行linux sudo指令时报sudo: sorry, you must have a tty to run sudo
在php程序中使用了exec函数调用sudo指令,在浏览器中访问后,报sudo: sorry, you must have a tty to run sudo错误. 按照网上搜到的方法,修改/etc/ ...
- BitAdminCore框架应用篇:(五)核心套件querySuite列的定义
索引 NET Core应用框架之BitAdminCore框架应用篇系列 框架演示:http://bit.bitdao.cn 框架源码:https://github.com/chenyinxin/coo ...
- 在Asp.net Core中使用中间件来管理websocket
介绍 ASP.NET Core SignalR是一个有用的库,可以简化Web应用程序中实时通信的管理.但是,我宁愿使用WebSockets,因为我想要更灵活,并且与任何WebSocket客户端兼容. ...
- C# 32位程序,申请大内存,附dome(wpf),亲测可用
1.我是vs2017,在选装vs的时候,需要安装c++模块,因为申请大内存的必要exe存放在vc的某个目录(下面会给出详细的地址)下的 2.安装完成在vs的安装目录可找到这个文件,我是社区版本的,如果 ...
- 网易云社区有奖问答活动第二期——技术领导力、深入分布式、PHP圣经、Linux运维、Unity……三月热点图书等你拿!
网易云社区第二期有奖问答活动开始了!(第一期活动已结束:人工智能图书大抽奖!) 欢迎积极参与网易云社区,讨论问题,交流心得.我们本期准备了一批技术领域热点图书,送给参与社区的朋友们,将以抽奖的形式送出 ...
- S11 day 94 RestFramework 之 APIView视图
VIEW视图(Django自带的) 1. url url(r'login/$', views.login.as_view()), 2.点开 as_view() , as_view()为类方法. l ...
- Linux下运行crm项目
虚拟环境运行crm项目 1.进入虚拟环境 2.解决crm项目运行所需的依赖环境 1.手动解决 pip3 install django==1.11.14 pip3 install pymysql pip ...
- [Swift实际操作]七、常见概念-(7)日历Calendar和日期组件DateComponents
本文将为你演示日历和日期组件的使用.通过日历的日期部件,可以获得日期的各个部分. 首先引入需要用到的界面工具框架 import UIKit 初始化一个日期对象,其值为当前的日期. let dt = D ...
- sqlmap命令详解
cookie注入:sqlmap.py -u 注入点 --cookie "参数" --tables --level 2 POST登录框注入:sqlmap.py -r 从文件读取数据 ...
- 可方便扩展的JIRA Rest Web API的封装调用
JIRA是一个缺陷跟踪管理系统,被广泛应用于缺陷跟踪.客户服务.需求收集.流程审批.任务跟踪.项目跟踪和敏捷管理等工作领域,当我们需要把第三方业务系统集成进来时,可以调用他的API. JIRA本身的A ...