我正在使用Express,EJS和MongoDB开发博客应用程序。
在我的posts.js
控制器中,我有:
exports.getSinglePost = (req, res) => {
let id = req.params.id;
Post.findById(id, function(err, post){
if(err){
console.log('Error: ', err);
} else {
res.render('singlepost', {
website_name: 'MEAN Blog',
post: post
});
}
});
};
singlepost.ejs视图包含以下代码:
<header class="masthead" style="background-image: url('assets/images/home-bg.jpg')">
<div class="overlay"></div>
<div class="container">
<div class="row">
<div class="col-lg-8 col-md-10 mx-auto">
<div class="site-heading">
<h1><%= post.title %></h1>
<span class="subheading"><%= post.short_description %></span>
</div>
</div>
</div>
</div>
</header>
<div class="container">
<div class="row">
<div class="col-lg-8 col-md-10 mx-auto">
<%= post.full_text %>
</div>
</div>
</div>
只要posts集合中的条目不包含HTML标记,它就可以正常工作:
{ "_id" : ObjectId("5e3063dbfa749d9229bab26f"), "title" : "Post One", "short_description" : "Lorem ipsum dolor sit amet.", "full_text" : "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."}
但是当它确实包含HTML标签时:
{ "_id" : ObjectId("5e317594fa749d9229bab271"), "title" : "Post One", "short_description" : "Dolor sit amet.", "full_text" : "<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>"}
该singlepost
视图在浏览器中呈现HTML :
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
在AngularJS中,使用可以轻松解决此问题ng-bind-html
,但是在此项目中我没有使用AngularJS。
因此,如何解决EJS中的此错误?
我已经<%= post.full_text %>
用<%- post.full_text %>
(替换=
为-
)解决了问题。
singlepost
现在的视图是这样的:
<header class="masthead" style="background-image: url('assets/images/home-bg.jpg')">
<div class="overlay"></div>
<div class="container">
<div class="row">
<div class="col-lg-8 col-md-10 mx-auto">
<div class="site-heading">
<h1><%= post.title %></h1>
<span class="subheading"><%= post.short_description %></span>
</div>
</div>
</div>
</div>
</header>
<div class="container">
<div class="row">
<div class="col-lg-8 col-md-10 mx-auto">
<%- post.full_text %>
</div>
</div>
</div>