NodeJS博客实战18_博客内容的添加功能实现

源码地址：https://github.com/RidingACodeToStray/Nodejs_blog

1，主要功能

1）博客内容的添加

2）博客内容添加页面展示分类列表

3）博客列表展示关联分类

2，实现思路

1）创建博客内容的结构表，并在表中关联category表

2）添加博客内容页面读取category表并展示出来

3）博客列表展示使用populate方法关系category表

3.代码展示：

1）创建content表并关联Category模型

schemas/content.js

//定义数据库表存储结构

//引入moogoose模块操作数据库
var mongoose = require('mongoose');

//定义用户表结构（字段和类型）,并暴露出去
module.exports = new mongoose.Schema({
	//关联字段 - 分类的id
	category:{
		type:mongoose.Schema.Types.ObjectId,
		//引用
		ref:'Category'
	},

	title:String,

	//简介
	desciption:{
		type:String,
		default: ''
	},
	//内容
	content: {
		type:String,
		default:''
	}
});

2)创建Content模型

models/Content.js

//创建一个Category的模型类
//实际操作的是操作通过操作模型类来对数据库操作（类似于tp里面的模型）
var mongoose = require('mongoose');
var ContentSchema = require('../schemas/content.js');

module.exports = mongoose.model('Content',ContentSchema)

3）内容展示列表，内容添加和内容保存

routers/admin.js

//内容首页
router.get('/content',function(req,res){
	//limit()限制获取的用户条数
	//skip()忽略数据的查询
	var page = Number(req.query.page) || 1;
	var limit = 2;
	var pages = 0;
	Content.count().then(function(count){
		//计算总页数向上取整
		pages = Math.ceil(count / limit);
		//page取值不能超过pages，去总页数和page中的最小值
		page = Math.min(page,pages);
		//page取值不能小于1
		page = Math.max(page,1);
		var skip = (page -1 ) * limit;
		//从数据中读取所有的用户数据
		//sort排序1表示升序-1表示降序
		//populate关联category的信息
		Content.find().sort({_id:-1}).limit(limit).skip(skip).populate('category').then(function(contents){
			res.render('admin/content_index',{
				userInfo:req.userInfo,
				contents:contents,
				page:page,
				count:count,
				pages:pages,
				limit:limit
			});
		});	
	})
})
//内容添加
router.get('/content/add',function(req,res){
	Category.find().sort({_id:-1}).then(function(categories){
		res.render('admin/content_add',{
			userInfo:req.userInfo,
			categories:categories
		})
	})
	
})
//内容保存
router.post('/content/add',function(req,res){
	// console.log(req.body);
	// 验证
	if (req.body.title == '') {
		res.render('admin/error',{
			userInfo:req.userInfo,
			message:'标题不能为空'
		})
		return;
	}
	if (req.body.content == '') {
		res.render('admin/error',{
			userInfo:req.userInfo,
			message:'内容不能为空'
		})
		return;
	}
	//保存
	new Content({
		category:req.body.category,
		title:req.body.title,
		desc:req.body.desc,
		content:req.body.content
	}).save().then(function(){
		res.render('admin/success',{
			userInfo:req.userInfo,
			message:'内容保存成功',
			url:'/admin/content'
		})
		return;
	})
})

4）内容列表展示页面

views/admin/category_index.html

{% extends 'layout.html' %}

{% block main %}
	<div class="a-userNav">
		<span><a href="/">管理首页</a></span>
		<span> / </span>
		<span>分类列表</span>
	</div>
	<div style="padding-left: 50px;text-align: right;margin-right: 10px;">
		<a href="/admin/category/add">添加分类</a>
		</div>
	<table class="a-userTable">
	<thead>
		<tr>
			<th>ID</th>
			<th>分类名称</th>
			<th>操作</th>
		</tr>
	</thead>
	<tbody>
		{% for category in categories %}
		<tr>
			<td>{{category._id.toString()}}</td>
			<td>{{category.name}}</td>
			<td>
					<a href="/admin/category/edit?id={{category._id.toString()}}">修改</a>
					<a href="/admin/category/delete?id={{category._id.toString()}}">删除</a>
			</td>
		</tr>
		{% endfor %}
	</tbody>
	</table>
		<div class="a-page">
		<span><a href="/admin/category?page={{page-1}}">上一页</a></span>
		<span class="a-pageInfo">
			当前第{{page}}页，每页{{limit}}条，共{{pages}}页{{count}}条数据
		</span>
		<span><a href="/admin/category?page={{page+1}}">下一页</a></span>
	</div>
{% endblock %}

5）内容添加页面

views/admin/content_add.html

{% extends 'layout.html' %}

{% block main %}
	<div class="a-userNav">
		<span><a href="/">管理首页</a></span>
		<span> / </span>
		<span>内容添加</span>
	</div>
	<form style="padding-left: 50px;margin-top: 20px;" method="post">
		<div>
			<label for="category">分        类:</label>
			<select name="category" id="category" style="width: 200px;">
				{% for category in categories %}
				<option value="{{category.id}}">{{category.name}}</option>
				{% endfor %}
			</select>
		</div>
		<div>
			<label for="title">内容标题:</label>
			<input type="text" name="title" id="title" style="width: 200px;">
		</div>
		<div>
			<label for="desc">简        介:</label>
			<input type="desc" name="desc" id="desc" style="width: 200px;">
		</div>
		<div>
			<label for="content" style="vertical-align: top;">内        容:</label>
			<textarea type="content" name="content" id="content" style="width: 200px;" rows="4"></textarea>
		</div>
		<button type="submit">提交</button>
	</form>
{% endblock %}