1
votes

Comment puis-je rendre des balises html dans une application de blog express et ejs?

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?


1 commentaires

3 Réponses :


-1
votes
<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.

0 commentaires

0
votes

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


0 commentaires

0
votes

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>


0 commentaires