网站首页 » 网站运营 » Linux » nodejs+express+mongodb+ejs 数据渲染实例
上一篇:
下一篇:

nodejs+express+mongodb+ejs 数据渲染实例

前言

nodejs+express+mongodb+ejs 的搭配相信很多朋友都不会陌生了,但对于初学者来说,这可以是一道不可逾越的鸿沟。比如:怎么从数据库中读取数据并渲染到页面中?这是一个前端总是会遇到的问题,下面我就给大家分享下如何实现数据的渲染。为了不让你有过多的负担,我这里只把关键代码贴出来,但也足以解决你的问题了。

例子

ejs 模板代码

<!DOCTYPE html>
<html>
  <head>
    <title>数据渲染简单实例</title>
    <link rel='stylesheet' href='/stylesheets/style.css' />
  </head>
  <body>
    <% articleResult.forEach(function (post, index) { %>
      <p><h2><a href="#"><%= post.title %></a></h2></p>
      <p class="info"><%= post.content %></p>
    <% }) %>
  </body>
</html>

index.js(路由)代码

var mongoose = require('mongoose'); //导入组件
var models = require('./models'); //导入自定义组件
var blogModel = models.blogart; //使用models.js中的 blogart 模型
var db = mongoose.connect('mongodb://localhost/blog'); //连接数据库
/* GET home page. */
router.get('/', function(req, res, next) {
    blogModel.find(function(error, result) {
        if (error) {
            console.log(error);
        } else {
            res.render('index', { articleResult: result });
        }
    });
});

model.js 代码

var mongoose = require('mongoose');
var Schema = mongoose.Schema;
var PostSchema = new Schema({
title: 'String',
content: 'String',
description: 'String',
by: 'String',
url: 'String',
tags: 'String',
likes: 'String',

});
exports.blogart = mongoose.model('blogart', PostSchema);

这个简单的数据渲染实例就这么完成了,是不是很简单。

送温暖

关于 index.ejs 模板中的代码应该不用多说了,这是模板引擎的代码书写规范。里面就是把 index.js 中返回的数据遍历出来。而model.js 侧是用于存放 mongoose.model 相关代码,放在 routes 目录下即与 index.js 同目录同级。这个例子需要安装 的模块 mongoose,这个怎么安装你可以看看这篇文章《http://yunkus.com/mongoose-install-config/

 

  • 微信扫一扫,赏我

  • 支付宝扫一扫,赏我

声明

原创文章,不经本站同意,不得以任何形式转载,如有不便,请多多包涵!

本文永久链接:http://yunkus.com/nodejs-express-mongodb-ejs-basic-demo/

Leave a Reply

Your email address will not be published. Required fields are marked *

评论 END