Je travaille sur une application de blog avec Express , EJS et MongoDB.
Dans mon contrôleur posts.js j'ai:
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
La vue singlepost.ejs a le code:
{ "_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>"}
Cela fonctionne bien tant que l'entrée dans la collection d'articles ne contient pas de balises 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."}
Mais quand cela le fait em> contiennent des balises HTML:
<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>
la vue singlepost rend le HTML dans le navigateur :
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
});
}
});
};
Dans AngularJS, le problème serait facilement résolu avec ng-bind-html , mais je n'utilise pas AngularJS dans ce projet.
Alors, comment puis-je corriger ce bogue dans EJS?
3 Réponses :
<p><%- post._id %></p> I think you can do something like this instead of what you are currently doing. But doing it by directly rendering tags won't be possible.
Vous utilisez le code suivant:
Post.findById(id).then(post=> res. render('singlepost', {post:post})). catch (err=>console.log(err));
Ensuite, vous enregistrez toute propriété de publication
J'ai résolu le problème en remplaçant par ( = avec - ).
La vue singlepost est maintenant comme ceci:
<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>
vérifiez cette réponse stackoverflow.com/questions/51407713/ejs-rendering-html