21 ~ express ~ 内容详情展示 和 阅读数处理

1，前台 ，/views/main/index.html ，将文章 id 通过url 传送给后台

{% for content in contents %}

<div class="panel-body">

<div class="panel panel-info">

<div class="panel-body">

<h4>【 {{content.title}} 】</h4>

<p>

作者 : {{content.user.username}} &nbsp;

发布时间 : {{content.addTime|date('Y-m-d')}} &nbsp;

阅读数量 : {{content.views}} &nbsp;

评论 : {{content}} &nbsp;

</p>

<p>简介 : {{content.description}}</p>

<p>

<a class="btn btn-info" href="/views?contentid={{content.id}}" role="button">内容详情</a>

</p>

</div>

</div>

</div>

{% endfor %}

 

2，后台 , /router/main.js ，增加  view 路由 ，读取文章的内容 ，渲染文章的页面 。 读取导航栏 。增加访问量。

 

/**

* 因为导航栏是前台每个栏目显示都需要的，所以不应该写在【/】 路由中，所以使用中间件的方法处理【 通用的数据 】

*/

router.use((req,res,next)=>{

/**

* ！！！【data必须是全局对象，否则中间件的下一个接收不到】

*/

data = {

 

userInfo:req.userInfo,

categories:[], //所有分类的信息

}

Category.find().then((categories)=>{

data.categories = categories

// console.log(data)

/**注意 next 的出口 */

next()

})

})

/**

* 首页

*/

router.get('/',(req,res)=>{

/**

* 从数据库中读取分类信息

* rs是一个数组类型的记录

*/

// data 不能重新等于新的对象

data.category =req.query.category || ''

data.page = Number(req.query.page || 1)

data.limit = 2

data.pages = 1

data.count= 0

 

var where = {}

if(data.category){

where.category = data.category

}

// console.log('where => '+where)

/**获取所有分类信息 */

Content.where(where).countDocuments().then((count)=>{

//为了方便,存入data

data.count = count

// 计算总页数，向上取整数,去最大值

data.pages = Math.ceil(data.count / data.limit)

 

// 页数取值不能超过总页数的值

data.page = Math.min(data.page,data.pages)

 

// 取值不能小于1

data.page = Math.max(data.page,1)

// 不需要被分配到模板 data 中 ，直接存入变量

var skip = (data.page-1)*data.limit

/**

* 读取文章并返回

*/

 

return Content.where(where).find().sort({_id:-1}).limit(data.limit).skip(skip).populate(['category','user'])

// 不 return 下面的参数将没有数据

}).then((contents)=>{

data.contents = contents

// console.log(data)

/**最后渲染 */

res.render('main/index',data)

})

 

})

router.get('/view',(req,res)=>{

contentid = req.query.contentid || ''

Content.findOne({

_id:contentid

}).then(content=>{

data.content = content

/** 增加阅读数 */

content.views++

content.save()

res.render('main/view',data)

})

})

 

3，前台展示 /views/main/view.html

 

<div class="panel-heading">文 章</div>

 

<h4>【 {{data.content.title}} 】</h4>

<p>

作者 : {{data.content.user.username}} &nbsp;

发布时间 : {{data.content.addTime|date('Y-m-d')}} &nbsp;

阅读数量 : {{data.content.views}} &nbsp;

评论 : {{data.content}} &nbsp;

</p>

<p>简介 : {{data.content.description}}</p>

<p>

内容 : {{data.content.content}}

</p>