JSON

Node.js + Express + MongoDB教程(3)

字号+ 作者:H5之家 来源:H5之家 2015-11-11 10:30 我要评论( )

这是越来越相当复杂不过,这是一个包装函数,参数是数据库变量db,然后做一个页面呈现,我们要使用('usercollection')做一个查询,然后返回变量文档结果,再做一个渲染的userlist(需要Jade模板)。 设置Jade模板,

这是越来越相当复杂不过,这是一个包装函数,参数是数据库变量db,然后做一个页面呈现,我们要使用('usercollection')做一个查询,然后返回变量“文档”结果,再做一个渲染的userlist(需要Jade模板)。

设置Jade模板,进入C:\node\nodetest1\views\ ,打开index.jade.转存为userlist.jade,打开编辑:

extends layout

block content
    h1.
        User List
    ul
        each user, i in userlist
            li
                a(href="mailto:#{user.email}")= user.username

这是显示我们一开始需要的输出列表结果。

重启nodejs,浏览器进入 :3000/userlist,输出:

 

 

写入数据库

写入数据库并不是特别困难。从本质上讲,我们需要设置一个路由,需要一个POST,而不是GET。

STEP 1 – 创建数据输入

打开app.js,找到 app.get(); 

app.get('/newuser', routes.newuser);

在其后面加入:

app.get('http://www.jdon.com/', routes.index);
app.get('/users', user.list);
app.get('/helloworld', routes.helloworld);
app.get('/userlist', routes.userlist(db));

// New Code
app.get('/newuser', routes.newuser);

打开 /routes/index.js增加路由

exports.newuser = function(req, res){
res.render('newuser', { title: 'Add New User' });
};

设置页面,通过jade模板,打开 /views/index.jade,,另存为newuser.jade,用下面内容完全替代:

extends layout

block content
    h1= title
    form#formAddUser(name="adduser",method="post",action="/adduser")
        input#inputUserName(type="text", placeholder="username", name="username")
        input#inputUserEmail(type="text", placeholder="useremail", name="useremail")
        button#btnSubmit(type="submit") submit

浏览器浏览:3000/newuser

STEP 2 – 创建 DB功能

打开app.js,再次找到app.get,在后面加入:

app.get('http://www.jdon.com/', routes.index);
app.get('/users', user.list);
app.get('/helloworld', routes.helloworld);
app.get('/userlist', routes.userlist(db));
app.get('/newuser', routes.newuser);

加入:

app.post('/adduser', routes.adduser(db));

打开/routes/index.js,加入:

exports.adduser = function(db) {
    return function(req, res) {

        // Get our form values. These rely on the "name" attributes
        var userName = req.body.username;
        var userEmail = req.body.useremail;

        // Set our collection
        var collection = db.get('usercollection');

        // Submit to the DB
        collection.insert({
            "username" : userName,
            "email" : userEmail
        }, function (err, doc) {
            if (err) {
                // If it failed, return error
                res.send("There was a problem adding the information to the database.");
            }
            else {
                // If it worked, set the header so the address bar doesn't still say /adduser
                res.location("userlist");
                // And forward to success page
                res.redirect("userlist");
            }
        });

    }
}

在成功添加到数据库中,我们的用户转发回的userlist页面,在那里他们将看到他们的新添加的用户。

STEP 4 – 连接数据库增加数据

重新启动nodejs,浏览:3000/newuser 输入数据

得到页面:

 

大功告成。

完整源码在github

 

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • Meteor node.js 复制(copy)文件的方法

    Meteor node.js 复制(copy)文件的方法

    2016-01-25 19:50

  • express json

    express json

    2015-11-23 19:06

  • Express 3.0新手指南入门教程

    Express 3.0新手指南入门教程

    2015-11-23 13:11

  • 针对JSON数据类型设计的数据仓库--甲骨文培训

    针对JSON数据类型设计的数据仓库--甲骨文培训

    2015-11-21 11:58

网友点评
5