对于应用程序来说,要定义的是一个任务文档,只需要一个“task”属性即可。
使用mongoose模块在mongodb中定义衣蛾文档的过程:通过mongoose提供的Schema借口定义,然后声明属性。
var Schema=mongoose.Schema,ObjectId=Schema.ObjectId;
var Task=new Schema({
task:String
});
var Task=mongoose.model('Task',Task);
一》查询:索引视图
1)创建路由:
app.get('/tasks', function(req, res){
Task.find({}, function (err, docs) {
res.render('tasks/index', {
title: 'Todos index view',
docs: docs
});
});
});
这是数据被传递到了视图层,这时需要到视图层中显示出这些结果出来:
2)将数据显示出来:
h1 Your tasks
- if(docs.length)
table
tr
th Task
each task in docs
tr
td #{task.task}
- else
p You don't have any tasks!
jade模板通过调用docs的length方法检查是否有文档存在,如果没有文档存在,他就会以false返回,如果有文档存在,则返回true.
3)测试:http://localhost:3000,如果有数据则显示出来,如果没有则不显示。
二》增加:创建视图
1)需要创建两个路由,一个是给用户来输入任务。
app.get('/tasks/new',function(req,res){
res.render('tasks/new.jade',{
title:'new task'
});
});
2)视图文件展示一个表单,以便让用户提交任务。下面使用twitter Bootstrap来提供表单的样式
a)需要在layout.jade中将其包含进来。
!!!
html
head
title= title
link(rel='stylesheet', href='http://twitter.github.com/bootstrap/1.4.0/bootstrap.min.css')
body
section.container!= body
b)在使用的元素上通过类名来应用正确的模式。
h1 New task view
form(method='post', action='/tasks')
fieldset
legend Add a task
div.clearfix
label Task
div.input
input(name='task[task]', class='xlarge')
div.actions
input(type='submit', value='Save', class='btn primary')
button(type='reset', class='btn') Cancel
3)创建一个新的路由来接受post请求并创建一个任务
app.post('/tasks', function(req, res){
var task = new Task(req.body.task);
task.save(function (err) {
if (!err) {
res.redirect('/tasks');
}
else {
res.redirect('/tasks/new');
}
});
});
重定向的路由如下:
app.get('/tasks', function(req, res){
Task.find({}, function (err, docs) {
res.render('tasks/index', {
title: 'Todos index view',
docs: docs
});
});
});
这样既可以在index中显示出来数据了。
4)到浏览器中输入:http://localhost:3000/tasks即可得到输入的内容,并且到保存到数据库中。
5)到数据库中查看:
D:\mongodb\mongodb-win32-i386-2.4.8\bin>mongo
MongoDB shell version: 2.4.8
connecting to: test
Server has startup warnings:
Sat Jan 11 22:49:18.920 [initandlisten]
Sat Jan 11 22:49:18.920 [initandlisten] ** NOTE: This is a 32 bit MongoDB binary.
Sat Jan 11 22:49:18.920 [initandlisten] ** 32 bit builds are limited to less than 2GB of data (or less with --journal).
Sat Jan 11 22:49:18.920 [initandlisten] ** Note that journaling defaults to off for 32 bit and is currently off.
Sat Jan 11 22:49:18.920 [initandlisten] ** See http://dochub.mongodb.org/core/32bit
Sat Jan 11 22:49:18.920 [initandlisten]
> show dbs
local 0.03125GB
test 0.0625GB
todo_development 0.0625GB
> use todo_development
switched to db todo_development
> show collections
system.indexes
tasks
> db.tasks.find()
{ "task" : "adafafdfa", "_id" : ObjectId("52d0ed2a6d7a03cc03f6c9a9"), "__v" : 0 }
>
可以看到mongodb的增加已经实现。
三》修改:编译视图
需要创建两个路由
1)用于显示可进行编辑的任务的表单
app.get('/tasks', function(req, res){
Task.find({}, function (err, docs) {
res.render('tasks/index', {
title: 'Tasks index view',
docs: docs
});
});
});
显示层(index.jade):
h1 Your tasks
p
a(href='/tasks/new', class='btn primary') Add a Task
- if(docs.length)
table
tr
th Task
th
each task in docs
tr
td #{task.task}
td
a.btn(href="/tasks/#{task.id}/edit") Edit
- else
p You don't have any tasks!
点击edit的时候,出现以下错误:
Express
500 Error: D:\nodejs\mongotest\views\tasks\index.jade:15<br/> 13| td #{task.task}<br/> 14| td<br/> > 15| a(href="/tasks/#{task.id}/edit") Edit<br/> 16| - else<br/> 17| p You
don't have any tasks! <br/> 18| <br/><br/>Invalid indentation, you can use tabs or spaces but not both
13| td #{task.task}
14| td
> 15| a(href="/tasks/#{task.id}/edit") Edit
16| - else
17| p You don't have any tasks!
18|
Invalid indentation, you can use tabs or spaces but not both
at Object.Lexer.indent (D:\nodejs\mongotest\node_modules\jade\lib\lexer.js:743:15)
2)用来接收寄送过来的数据并更新记录
app.get('/tasks/:id/edit', function(req, res){
Task.findById(req.params.id, function (err, doc){
res.render('tasks/edit', {
title: 'Edit Task View',
task: doc
});
});
});
编辑页面(edit.jade):
h1 Edit task view
form(method='post', action='/tasks/' + task.id)
input(name='_method', value='PUT', type='hidden')
fieldset
legend Editing task
div.clearfix
label Task
div.input
input(name='task[task]', class='xlarge', value="#{task.task}")
div.actions
input(type='submit', value='Save', class='btn primary')
button(type='reset', class='btn') Cancel
3)接收编辑后的内容:
app.put('/tasks/:id', function(req, res){
Task.findById(req.params.id, function (err, doc){
doc.updated_at = new Date();
doc.task = req.body.task.task;
doc.save(function(err) {
if (!err){
res.redirect('/tasks');
}
else {
// error handling
}
});
});
});
保存后,再重定向到tasks页面中去。
四》删除:
1)添加删除任务的路由:
app.del('/tasks/:id', function(req, res){
Task.findOne({ _id: req.params.id }, function(err, doc) {
if (!doc) return next(new NotFound('Document not found'));
doc.remove(function() {
res.redirect('/tasks');
});
});
});
2)创建有delete的视图:
h1 Your tasks
p
a(href='/tasks/new', class='btn primary') Add a Task
- if(docs.length)
table
tr
th Task
th
th
each task in docs
tr
td #{task.task}
td
a.btn(href="/tasks/#{task.id}/edit") Edit
td
form(method='post', action='/tasks/' + task.id)
input(name='_method', value='DELETE', type='hidden')
button.btn(type='submit') Delete
- else
p You don't have any tasks!