端午节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三的更多相关文章

  1. Node.js、express、mongodb 实现分页查询、条件搜索

    前言 在上一篇Node.js.express.mongodb 入门(基于easyui datagrid增删改查) 的基础上实现了分页查询.带条件搜索. 实现效果 1.列表第一页. 2.列表第二页 3. ...

  2. node.js和express.js安装和使用步骤 [windows]

    PS: NODEJS:https://nodejs.org NPM:https://www.npmjs.com/ 一.node.js安装与配置 到https://nodejs.org/en/downl ...

  3. Node.js基于Express框架搭建一个简单的注册登录Web功能

    这个小应用使用到了node.js  bootstrap  express  以及数据库的操作 :使用mongoose对象模型来操作 mongodb 如果没了解过的可以先去基本了解一下相关概念~ 首先注 ...

  4. Node.js系列-express(上)

    前言 Node.js系列的第一篇:http,大概描述了通过使用node.js内置的api创建一个服务并监听request实现简单的增删改查.现在,我们就通过通读express官网及使用express框 ...

  5. node.js之express框架

    之前学习过node.js接触过express框架,最近为了编写一个mock server正好用到了express.下面正好就跟大家介绍一下关于express.今天的内容主要围绕这么几个方面? expr ...

  6. Node.js、express、mongodb 入门(基于easyui datagrid增删改查)

    前言 从在本机(win8.1)环境安装相关环境到做完这个demo大概不到两周时间,刚开始只是在本机安装环境并没有敲个Demo,从周末开始断断续续的想写一个,按照惯性思维就写一个增删改查吧,一方面是体验 ...

  7. node.js框架express的安装

    node.js框架express的安装 首先假定你已经安装了 Node.js,接下来为你的应用创建一个目录,然后进入此目录并将其作为当前工作目录. $ mkdir myapp $ cd myapp 通 ...

  8. node.js,express入门看详细篇

    先最简单的代码 安装 npm install express app.js 代码内容 const express = require('express') const app = express() ...

  9. node.js使用express框架进行文件上传

    关于node.js使用express框架进行文件上传,主要来自于最近对Settings-Sync插件做的研究.目前的研究算是取得的比较好的进展.Settings-Sync中通过快捷键上传文件,其实主要 ...

随机推荐

  1. Spring Boot 2 实践记录之 使用 Powermock、Mockito 对 UUID 进行 mock 单元测试

    由于注册时,需要对输入的密码进行加密,使用到了 UUID.sha1.md 等算法.在单元测试时,使用到了 Powermock,记录如下. 先看下加密算法: import org.apache.comm ...

  2. .NET Core 和 .NET .Framework 速度比较

    废话不多说! 一下是 .NET core 和 .NET framework 速度对比. 两者使用最慢的冒泡排序算法:  排序10万条数据 次数 .NET CORE(耗时) .NET framework ...

  3. C#构造方法(函数)

    一.概括 1.通常创建一个对象的方法如图: 通过  Student tom = new Student(); 创建tom对象,这种创建实例的形式被称为构造方法. 简述:用来初始化对象的,为类的成员赋值 ...

  4. The rapid development platform upgrade, leave the time to yourself, the work is lost to the soft platform

    Bring me back to your home. Please leave your work behind! Soft agile development framework V7.0 new ...

  5. IT和非IT人士:2分钟了解什么是区块链

    本文由  网易云发布. (非IT:阅读常规部分:IT:阅读引用块) 作者:任长存,网易杭州研究院工程师 前言 信息的高速发展,致使互联网风口犹如娱乐圈,移动互联网,微博.直播.共享经济.短视频.小程序 ...

  6. rabbitMQ的简单实例——amqp协议带数据回写机制

    rabbitMQ是一种高性能的消息队列,支持或者说它实现了AMQP协议(advanced message queue protocol高级消息队列协议). 下面简单讲一讲一个小例子.我们首先要部署好r ...

  7. ElasticSearch学习总结(二):ES介绍与架构说明

    本文主要从概念以及架构层面对Elasticsearch做一个简单的介绍,在介绍ES之前,会先对ES的"发动机"Lucene做一个简单的介绍 1. Lucene介绍 为了更深入地理解 ...

  8. SVN版本服务器的搭建和远程控制

    版本服务器是用SVN server(这个东西是放到版本机服务器上的)  版本管理工具是用小乌龟(tortoiseSVN,这个是在各个机器上使用) 1,昨天下载了SVN server 按照网上教程搭建好 ...

  9. 利用Django做一个简单的分页页面

    views代码: from django.shortcuts import render from django.conf import settings from booktest.models i ...

  10. Swift Podfile中的 use_frameworks!

    use_frameworks! A.用cocoapods 导入swift 框架 到 swift项目和OC项目都必须要 use_frameworks!B.使用 dynamic frameworks,必须 ...